Pełne wymiary ekranu możemy pobrać za pomocą metody screen.width i screen. height. Wymiary monitora bez paska narzędzi pobieramy za pomocą metod screen.availWidth i screen.availHeight
<!DOCTYPE html>
<html lang="pl">
<meta charset="UTF-8">
<title>Page Title</title>
<meta name="viewport" content="width=device-width,initial-scale=1">
<script>
function init(){
var panel = document.getElementById("panel");
var szerokosc, wysokosc, dostSzerokosc, dostWysokosc;
szerokosc = screen.width;
wysokosc = screen.height;
dostSzerokosc = screen.availWidth;
dostWysokosc = screen.availHeight;
panel.innerHTML = "Rozdzielczosc: " + szerokosc + " x " + wysokosc + "<br>";
panel.innerHTML += "Dostepna powierzchnia: " + dostSzerokosc + " x " + dostWysokosc;
}
document.addEventListener("DOMContentLoaded",init,false);
</script>
<body>
<div id="panel"></div>
</body>
</html>Wymiary okna przeglądarki
<!DOCTYPE html>
<html lang="pl">
<meta charset="UTF-8">
<title>Page Title</title>
<meta name="viewport" content="width=device-width,initial-scale=1">
<script>
function init(){
var panel = document.getElementById("panel");
var szerokoscOkna, wysokoscOkna;
var szerokoscClient, wysokoscClient;
szerokoscOkna = innerWidth;
wysokoscOkna = innerHeight;
szerokoscClient = document.documentElement.clientWidth;
wysokoscClient = document.documentElement.clientHeight;
panel.innerHTML += "Wymiar okna: " + szerokoscOkna + " x " + wysokoscOkna + "<br>";
panel.innerHTML += "Wymiar okna client: " + szerokoscClient + " x " + wysokoscClient;
}
document.addEventListener("DOMContentLoaded",init,false);
</script>
<body>
<div id="panel"></div>
</body>
</html>Zamykanie obecnego lub otwieranie nowego okna
Za pomocą metody window.open() możemy otworzyć nowe okno przeglądarki, a za pomocą window.close() możemy zamknąć aktualne okno.
<!DOCTYPE html>
<html lang="pl">
<meta charset="UTF-8">
<title>Page Title</title>
<meta name="viewport" content="width=device-width,initial-scale=1">
<script>
function openNewWindow(){
window.open();
}
</script>
<body>
<button id="panel" onclick="openNewWindow()">Click me</button>
</body>
</html>