JavaScript ile Ekran Bilgilerini Alma

Karaoz Onr
1 min readJul 9, 2024

--

Kullanıcının ekran boyutlarını ve özelliklerini almak bazen gerekli olabilir. Bu makalede, ekran genişliği, yüksekliği ve renk derinliğini alarak bu bilgileri ekrana yazdıran bir JavaScript kodunu inceleyeceğiz.

window.addEventListener('load', getfunc);

function getfunc() {
// Ekran Genişliğiniz:
document.getElementById("kutu1").innerHTML = "Ekran Genişliğiniz: " + screen.width;
// Ekranın Yüksekliğiniz:
document.getElementById("kutu2").innerHTML = "Ekran Yüksekliğiniz: " + screen.height;
// Renk derinliğiniz:
document.getElementById("kutu3").innerHTML = "Renk derinliğiniz: " + screen.colorDepth; // Screen.pixelDepth de kullanılabilir.
}
window.addEventListener('load', getfunc);

Bu satır, sayfa tamamen yüklendiğinde getfunc fonksiyonunu çağırmak için bir olay dinleyicisi ekler. window.addEventListener kullanarak load olayını dinler ve getfunc fonksiyonunu çalıştırır.

document.getElementById("kutu1").innerHTML = "Ekran Genişliğiniz: " + screen.width;
  • screen.width kullanıcının ekran genişliğini piksel cinsinden döndürür.
  • Bu bilgi, kutu1 ID'sine sahip HTML elemanının içeriğine yazdırılır.
document.getElementById("kutu2").innerHTML = "Ekran Yüksekliğiniz: " + screen.height;
  • screen.height kullanıcının ekran yüksekliğini piksel cinsinden döndürür.
  • Bu bilgi, kutu2 ID'sine sahip HTML elemanının içeriğine yazdırılır.
document.getElementById("kutu3").innerHTML = "Renk derinliğiniz: " + screen.colorDepth; // Screen.pixelDepth de kullanılabilir.
  • screen.colorDepth kullanıcının ekranının renk derinliğini döndürür (genellikle bit cinsinden).
  • Bu bilgi, kutu3 ID'sine sahip HTML elemanının içeriğine yazdırılır.

Bu makalede, kullanıcı ekran bilgilerini alıp ekrana yazdıran basit bir JavaScript fonksiyonunu inceledik. Bu bilgiler, özellikle kullanıcı arayüzünü optimize etmek veya cihaz özelliklerine göre içerik sunmak için yararlı olabilir.

--

--