JavaScript & BOM - Window Screen


Zaslonski objekt (Screen Object)

Objekt window.screen sadrži informacije o korisnikovom zaslonu kao što je razolucija (tj. širina i visina zaslona), dubina boje, dubina piksela itd. Budući da se objekt prozora nalazi na vrhu lanca opsega, svojstvima objekta window.screen može se pristupiti bez navođenja prefiksa window., na primjer window.screen.width može se zapisati kao screen.width. Sljedeći dio će vam pokazati kako doći do informacija o korisnikovom zaslonu pomoću svojstva objekta zaslona (Screen Object) i objekta prozora (Window).



Dobijanje širine i visine ekrana

Možete koristiti svojstvo screen.width i screen.height da biste dobili širinu i visinu korisnikovog zaslona u pikselima. Sljedeći primjer će prikazati vašu razlučivost zaslona nakon klika na dugme:

<script>
function getResolution() {
    alert("Vaš rezolucija je: " + screen.width + "x" + screen.height);
}
</script>
 
<button type="button" onclick="getResolution();">Prikaži rezoluciju</button>
Pogledajmo kako koristiti primjer u praksi:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <title>JavaScript Dobijanje rezoluciju ekrana</title>
</head>
<body>
    <script>
    function getResolution() {
        alert("Vaš rezolucija je: " + screen.width + "x" + screen.height);
    }
    </script>
     
    <button type="button" onclick="getResolution();">Prikaži rezoluciju</button>
</body>
</html>                            


Dobijanje širine i visine ekrana

Svojstvo screen.availWidth i screen.availHeight mogu se koristiti za dobijanje širine i visine dostupne pretraživaču za upotrebu na korisnikovom ekranu, u pikselima. Dostupna širina i visina ekrana jednaki su stvarnoj širini i visini ekrana umanjenoj za širinu i visinu karakteristika interfejsa poput trake zadataka u Windowsu. Pogledajmo primjera:

Dostupna širina i visina ekrana jednaki su stvarnoj širini i visini ekrana umanjenoj za širinu i visinu karakteristika interfejsa poput trake zadataka u Windowsu. Pogledajmo primjera:

<script>
function getAvailSize() {
    alert("Dostupna širina ekrana: " + screen.availWidth + ", Height: " + screen.availHeight);
}
</script>
 
<button type="button" onclick="getAvailSize();">Dostupnu veličinu</button>
Pogledajmo kako koristiti primjer u praksi:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <title>JavaScript Dobijanje dostupne širine i visine ekrana</title>
</head>
<body>
    <script>
    function getAvailSize() {
        alert("Dostupna širina ekrana: " + screen.availWidth + ", Height: " + screen.availHeight);
    }
    </script>
     
    <button type="button" onclick="getAvailSize();">Dostupnu veličinu</button>
</body>
</html>                            


Dobijanje dubine boje ekrana

Svojstvo screen.colorDepth možete koristiti za dobijanje dubine boje korisnikovog ekrana. Dubina boje je broj bitova koji se koristi za predstavljanje boje jednog piksela. Dubina boje pokazuje koliko boja je ekran uređaja sposoban da proizvede. Na primjer, ekran s dubinom boje 8 može proizvesti 256 boja (28).

Trenutno većina uređaja ima ekran s dubinom boje od 24 ili 32. Jednostavnim riječima, više bitova proizvodi više varijacija boja, poput 24 bita može proizvesti 224 = 16.777.216 varijacija boja (istinske boje), dok 32 bita mogu proizvesti 232 = 4.294.967.296 varijacija boja (duboke boje).

<script>
function getColorDepth() {
    alert("Dubina boje vašeg ekrana je: " + screen.colorDepth);
}
</script>
 
<button type="button" onclick="getColorDepth();">Prikaži dubinu boje</button>
Pogledajmo kako koristiti primjer u praksi:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <title>JavaScript Dohvatanje dubinu boje ekrana</title>
</head>
<body>
    <script>
    function getColorDepth() {
        alert("Dubina boje vašeg ekrana je: " + screen.colorDepth);
    }
    </script>
     
    <button type="button" onclick="getColorDepth();">Prikaži dubinu boje</button>
</body>
</html>                            


Dobijanje dubine piksela na ekranu

Dubinu ekrana u pikselima možete dobiti pomoću svojstva screen.pixelDepth. Dubina piksela je broj bitova koje koristi hardverski zaslon po pikselu. Za moderne uređaje dubina boje i dubina piksela su jednake. Pogledajmo primjera:

<script>
function getPixelDepth() {
    alert("Dubina piksela vašeg ekrana je: " + screen.pixelDepth);
}
</script>
 
<button type="button" onclick="getPixelDepth();">Prikaži dubinu piksela</button>
Pogledajmo kako koristiti primjer u praksi:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <title>JavaScript Dobijanje dubine ekrana piksela</title>
</head>
<body>
    <script>
    function getPixelDepth() {
        alert("Dubina piksela vašeg ekrana je: " + screen.pixelDepth);
    }
    </script>
     
    <button type="button" onclick="getPixelDepth();">Prikaži dubinu piksela</button>
</body>
</html>