Cara Mengetahui Lebar dan Tinggi Jendela Web Browser
Pernah kah teman-teman berfikir, atau kepikiran tak jikalau kita dapat menghitung lebar dan tinggi sebuah web browser, bagi cara mengetahui lebar dan tinggi jendela web browser, kita akan mengguinakan javascript, dengan bantuan javascript browser BOM, kita dapat menjalankan itu, jadi nantinya kita akan menghitung dengan javascript, lalu hitungan itu kita akan cetak di sebuah tag, kurang lebihnya seperti itu, caranya benar-benar simple ko teman-teman, oke bagi mengetahui itu jangan kemana-mana simak terus ya.
Cara mengetahui lebar dan tinggi jendela web browser, ada beberapa properties, di antaranya:
- window.innerHeight – Ketinggian pada jendela browser (pada pixels ya).
- window.innerWidth – Ketinggian pada jendela browser (pada pixels ya).
akan tetapi itu bagi web browser modern bagaimana jikalau ada yang masih menggunakan webbrowser lama, seperti internet exploler, bagi internet exploler 8,7,6,5 di antaranya:
- document.documentElement.clientHeight
- document.documentElement.clientWidth or
- document.body.clientHeight
- document.body.clientWidth
Sumber ini saya dapatkan dari w3school ya teman-teman, nanti teman-teman dapat lihat sendiri jikalau ingin mengetahuinya, oke lalu bagaimana jikalau saya ingin di segala browser dapat menggunakannya, kita dapat menggunakan cara sebagi berikut, sumber w3school:
<!DOCTYPE html>
<html>
<head>
<title>Cara Mengetahui Lebar dan Tinggi Jendela Web Browser</title>
<-e-style type=text/css>
.container{
width: 500px;
margin: auto;
background: #F3F3F3;
box-shadow: 5px 5px 5px 5px #555;
text-align: center;
}
.container_2{
width: 60px;
margin: auto;
}
p{
background-color: magenta;
width: 300px;
margin: auto;
padding: 5px;
border-radius: 5px;
}
</style>
</head>
<body>
<div class=container>
<h1>Cara Mengetahui Lebar dan Tinggi Jendela Web Browser</h1>
<p id=demo></p>
<-e-script>
var widthNode = window.innerWidth
document.documentElement.clientWidth
document.body.clientWidth;
var heightNode = window.innerHeight
document.documentElement.clientHeight
document.body.clientHeight;
var demoNode = document.getElementById(demo);
demoNode.innerHTML = Telah di Ketahui tinggi dan lebar jendela Web Browser ini Yaitu: <br> + Lebar + widthNode + , Tinggi: + heightNode + .;
</script>
</div>
</body>
</html>
Jadi dengan menggunakan script yang saya bikin di atas, dan hasil output, saya membuatnya dengan tag p dengan id demo, jadi nanti penghitungannya dapat tampil di sana: oke seketika saja kita liat hasilnya:
Gambar di atas yakni hasil normal ya, kebetulan karena saya menggunakan komputer yang lumayan lebar, kita dapatkan lebar dan tingginya sekitar: 1920px dan tinggi 947px, Lalu kini saya akan coba mengecilkan browsernya, karenanya saya akan memperoleh:
Lebar dan tinggi yang berbeda, oiy ketika ingin mengecek, teman-teman mesti refresh terlebih dahulu ya, oke benar-benar simple ya teman-teman, dan saya rasa lumayan hingga disini dulu belajar kita mengenai Cara mengetahui lebar dan tinggi jendela web browser, semoga bermanfaat dan hingga jumpa di artikel berikutnya terimakasih.
Sumber https://kursuswebsite.org
