JavaScript Pencere Ekranı

İçindekiler

    İçindekiler tablosunu göster

window.screen nesnesi bilgi içerir Kullanıcının ekranı hakkında.

Pencere ekranı

window.screen nesnesi, pencere öneki olmadan yazılabilir.

Özellikler:

  • screen.width

  • screen.height

  • screen.availWidth

  • screen.availHeight

  • screen.colorDepth

  • screen.pixelDepth

Pencere Ekranı Genişliği

screen.width özelliği, ziyaretçinin ekranının genişliğini döndürür. piksel.

Örnek

Ekranın genişliğini piksel cinsinden görüntüleyin:

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

Sonuç şöyle olacaktır:

<script> document.write("Screen Width: " + screen.width);

Kendiniz Deneyin →

<!DOCTYPE html>
<html>
<body>

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

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

</body>
</html>

Pencere Ekranı Yüksekliği

screen.height özelliği, ziyaretçinin ekranının yüksekliğini piksel cinsinden döndürür.

Örnek

Ekranın yüksekliğini piksel cinsinden görüntüleyin:

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

Sonuç şöyle olacaktır:

<script> document.write("Screen Height: " + screen.height);

Kendiniz Deneyin →

<!DOCTYPE html>
<html>
<body>

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

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

</body>
</html>

Pencere Ekranı Mevcut Genişlik

screen.availWidth özelliği, ziyaretçinin ekranının genişliğini döndürür. piksel, Windows Görev Çubuğu gibi eksi arayüz özellikleri.

Örnek

Ekranın kullanılabilir genişliğini piksel cinsinden görüntüleyin:

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

Sonuç şöyle olacaktır:

<script> document.write("Available Screen Width: " + screen.availWidth);

Kendiniz Deneyin →

<!DOCTYPE html>
<html>
<body>

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

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

</body>
</html>

Pencere Perdesi Mevcut Yükseklik

screen.availHeight özelliği, ziyaretçinin ekranının yüksekliğini döndürür, piksel cinsinden eksi Windows Görev Çubuğu gibi arayüz özellikleri.

Örnek

Ekranın mevcut yüksekliğini piksel cinsinden görüntüleyin:

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

Sonuç şöyle olacaktır:

<script> document.write("Available Screen Height: " + screen.availHeight);

Kendiniz Deneyin →

<!DOCTYPE html>
<html>
<body>

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

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

</body>
</html>

Pencere Ekranı Renk Derinliği

screen.colorDepth özelliği, bir rengi görüntülemek için kullanılan bit sayısını döndürür.

Tüm modern bilgisayarlar, renk çözünürlüğü için 24 bit veya 32 bit donanım kullanır:

  • 24 bit = 16.777.216 farklı "Gerçek Renk"

  • 32 bit=4.294.967.296 farklı "Derin Renk"

Daha eski bilgisayarlar 16 bit kullanıyordu: 65.536 farklı "Yüksek Renk" çözünürlüğü.

Çok eski bilgisayarlar ve eski cep telefonları 8 bit kullanıyordu: 256 farklı "VGA rengi".

Örnek

Ekranın renk derinliğini bit cinsinden görüntüleyin:

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

Sonuç şöyle olacaktır:

<script> document.write("Screen Color Depth: " + screen.colorDepth);

Kendiniz Deneyin →

<!DOCTYPE html>
<html>
<body>

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

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

</body>
</html>

HTML'de kullanılan #rrggbb (rgb) değerleri "Gerçek Renkleri" temsil eder (16.777.216 farklı renk)

Pencere Ekranı Piksel Derinliği

screen.pixelDepth özelliği ekranın piksel derinliğini döndürür.

Örnek

Ekranın piksel derinliğini bit cinsinden görüntüleyin:

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

Sonuç şöyle olacaktır:

<script> document.write("Screen Pixel Depth: " + screen.pixelDepth);

Kendiniz Deneyin →

<!DOCTYPE html>
<html>
<body>

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

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

</body>
</html>

Modern bilgisayarlar için Renk Derinliği ve Piksel Derinliği eşittir.