Előfordulhat, hogy a JavaScript alkalmazásának tudnia kell, hogy a méretméretű képernyőnek milyen műveletek végrehajtásához kell lennie.
Szerencsénkre vannak beépített JavaScript funkciók, amelyek pixelben egyszerűen megragadhatják a képernyő különböző méreteit a felhasználó eszközén. Amit használ, attól függ, mit szeretne csinálni.
Szerezd meg a felhasználó felbontását
Érdemes lehet valamit megtenni, amely a felhasználó eszközfelbontását tartalmazza. Ebben az esetben a beépített screen.widthés screen.heighttulajdonságokat kell használnia . Ezek megadják a képernyő méretét, amellyel foglalkozik.
Nem ezen a területen kell dolgoznia az oldalon .Ezek az értékek a képernyő teljes egészét , vagyis a felhasználó megjelenítési felbontását képviselik.
Böngésző méretének megadása
Érdekes alkalmazás lehet a böngésző jelenlegi méretének kezelésére. Ha hozzáférnie kell ezekhez a dimenziókhoz, használja a screen.availWidthés screen.availHeighttulajdonságokat.
Ne feledje, hogy ezek a teljes böngészőablak méretei, a böngészőablak tetejétől kezdve egészen addig, ahol a böngésző találkozik a tálcával vagy az asztal szélével, a telepítéstől függően.
Érdekes megjegyzés :screen.availHeightarra is kitalálható, hogy milyen magas a tálca a számítógépen. Ha a böngésző felbontása mondjuk1366 x 768, ésscreen.availHeight728 pixelt jelent, akkor a tálca 40 pixel magas. Kiszámíthatja a tálca magasságát kivonássalscreen.heightésscreen.availHeight:
var taskbarHeight = parseInt(screen.height,10) - parseInt(screen.availHeight,10) + " pixels"; /* For a user that has a screen resolution of 1366 x 768 pixels, their taskbar is likely 40 pixels if using Windows 10 with no added accessibility features. */Nézze meg az ablak méretét
Ezek a tulajdonságok érdekesek, és felhasználhatók néhány remek hatás létrehozására. A window.innerHeightés window.innerWidthsegítségével megadhatja a weboldal ablakának méretét, ahogyan a felhasználó látja.
Ne feledje - ezek az értékek nem statikusak, és attól függően változnak, hogy mi történik a böngészővel. Más szóval, ha maga a böngésző kicsi, akkor ezek az értékek kisebbek lesznek, és ha a böngészőt maximalizálják, akkor nagyobbak lesznek.
Ha például a Google Chrome-ban dolgozik, és kinyitja a konzolt (az ablak egyik oldalához kell dokkolni), window.innerHeightakkor az a konzol magasságát tükrözi, mert az ablak egy része blokkolva lesz.
Kipróbálhatja ezt úgy, hogy felhívja window.innerHeight, figyelembe veszi az értéket, majd növeli a konzol méretét, majd hívja window.innerHeightújra.
Ezek a tulajdonságok akkor is megváltoznak, ha a böngészőt bármilyen módon maximalizálják vagy átméretezik. A böngésző maximális méreténél a tulajdonság window.innerWidthmegegyezik mindkettővel, screen.widthés screen.availWidth(hacsak nincs egy tálca az oldalon, amely esetben screen.availWidthnem lesz egyenlő). window.innerHeightmegegyezik a terület nagyságával az oldal ablakában (a weboldal területe).
Szerezd meg a weboldal magasságát és szélességét
Ha meg kell néznie, hogy a weblapja milyen magas vagy széles valójában, akkor vannak olyan tulajdonságok, amelyek megragadják ezeket a méreteket: document.body.offsetWidthés document.body.offsetHeight.
Ezek a tulajdonságok magának az oldalnak a tartalmát jelentik. A tartalom nélküli oldal document.body.offsetHeightközel azonos értékkel rendelkezik, mint window.innerHeightattól függően, hogy milyen margók / kitöltések vannak a dokumentum törzsén. Ha a margók és a kitöltés 0a html gyökérelemre és a dokumentum törzsére van állítva , akkor document.body.offsetHeightés window.innerHeightegyenlő lesz tartalom nélkül.
Ezek a tulajdonságok felhasználhatók az oldaladdal / alkalmazásoddal való interakcióra attól függően, hogy mit szeretnél csinálni.