Obrazovka okna JavaScript

Obsah

Zobrazit obsah

Objekt window.screen obsahuje informace o obrazovce uživatele.

Obrazovka okna

Objekt window.screen lze zapsat bez prefixu okna.

Vlastnosti:

screen.width
screen.height
screen.availWidth
screen.availHeight
screen.colorDepth
screen.pixelDepth

Šířka obrazovky okna

Vlastnost screen.width vrací šířku obrazovky návštěvníka v pixelů.

Příklad

Zobrazení šířky obrazovky v pixelech:

document.getElementById("demo").innerHTML =
"Screen Width: " + screen.width;

Výsledek bude:

Zkuste to sami →

<!DOCTYPE html>
<html>
<body>

<p id="demo"></p>

<script>
document.getElementById("demo").innerHTML = 
"Screen width is " + screen.width;
</script>

</body>
</html>

Výška obrazovky okna

Vlastnost screen.height vrací výšku obrazovky návštěvníka v pixelech.

Příklad

Zobrazení výšky obrazovky v pixelech:

document.getElementById("demo").innerHTML =
"Screen Height: " + screen.height;

Výsledek bude:

Zkuste to sami →

<!DOCTYPE html>
<html>
<body>

<p id="demo"></p>

<script>
document.getElementById("demo").innerHTML = 
"Screen height is " + screen.height;
</script>

</body>
</html>

Dostupná šířka obrazovky okna

Vlastnost screen.availWidth vrací šířku obrazovky návštěvníka v pixely, minus funkce rozhraní, jako je hlavní panel Windows.

Příklad

Zobrazte dostupnou šířku obrazovky v pixelech:

document.getElementById("demo").innerHTML =
"Available Screen Width: " + screen.availWidth;

Výsledek bude:

Zkuste to sami →

<!DOCTYPE html>
<html>
<body>

<p id="demo"></p>

<script>
document.getElementById("demo").innerHTML = 
"Available screen width is " + screen.availWidth;
</script>

</body>
</html>

Dostupná výška okenní clony

Vlastnost screen.availHeight vrací výšku obrazovky návštěvníka, v pixelech, mínus funkce rozhraní, jako je hlavní panel Windows.

Příklad

Zobrazte dostupnou výšku obrazovky v pixelech:

document.getElementById("demo").innerHTML =
"Available Screen Height: " + screen.availHeight;

Výsledek bude:

Zkuste to sami →

<!DOCTYPE html>
<html>
<body>

<p id="demo"></p>

<script>
document.getElementById("demo").innerHTML = 
"Available screen height is " + screen.availHeight;
</script>

</body>
</html>

Barevná hloubka obrazovky okna

Vlastnost screen.colorDepth vrací počet bitů použitých k zobrazení jedné barvy.

Všechny moderní počítače používají 24bitový nebo 32bitový hardware pro rozlišení barev:

24 bitů = 16 777 216 různých „skutečných barev“
32 bitů=4 294 967 296 různých "hlubokých barev"

Starší počítače používaly 16 bitů: 65 536 různých rozlišení „High Colors“.

Velmi staré počítače a staré mobilní telefony používaly 8 bitů: 256 různých "VGA barev".

Příklad

Zobrazte barevnou hloubku obrazovky v bitech:

document.getElementById("demo").innerHTML = 
"Screen Color Depth: " + screen.colorDepth;

Výsledek bude:

Zkuste to sami →

<!DOCTYPE html>
<html>
<body>

<p id="demo"></p>

<script>
document.getElementById("demo").innerHTML = 
"Screen color depth is " + screen.colorDepth;
</script>

</body>
</html>

Hodnoty #rrggbb (rgb) používané v HTML představují „skutečné barvy“ (16 777 216 různých barev)

Hloubka pixelů obrazovky okna

Vlastnost screen.pixelDepth vrací hloubku obrazovky v pixelech.

Příklad

Zobrazte hloubku pixelů obrazovky v bitech:

document.getElementById("demo").innerHTML =
"Screen Pixel Depth: " + screen.pixelDepth;

Výsledek bude:

Zkuste to sami →

<!DOCTYPE html>
<html>
<body>

<p id="demo"></p>

<script>
document.getElementById("demo").innerHTML = 
"Screen pixel depth is " + screen.pixelDepth;
</script>

</body>
</html>

U moderních počítačů jsou barevná hloubka a hloubka pixelů stejné.