To‘liq ekranli oyna
JavaScript yordamida to‘liq ekranli oyna yaratishni o‘rganing.
To‘liq ekranli oyna
Elementni to‘liq ekran rejimida ko‘rish uchun JavaScript’dan qanday foydalanish mumkin.
Videoni to‘liq ekran rejimida ochish uchun tugmani bosing:
To‘liq ekranli video
Elementni to‘liq ekranda ochish uchun element.requestFullscreen() metodidan foydalanamiz:
Misol
<script>
/* Get the element you want displayed in fullscreen mode (a video in this example): */
var elem = document.getElementById("myvideo");
/* When the openFullscreen() function is executed, open the video in fullscreen.
Note that we must include prefixes for different browsers, as they don't support the requestFullscreen method yet */
function openFullscreen() {
if (elem.requestFullscreen) {
elem.requestFullscreen();
} else if (elem.webkitRequestFullscreen) { /* Safari */
elem.webkitRequestFullscreen();
} else if (elem.msRequestFullscreen) { /* IE11 */
elem.msRequestFullscreen();
}
}
</script>
O‘zingiz sinab ko‘ring »
To‘liq ekranli hujjat
Butun sahifani to‘liq ekranda ochish uchun document.getElementById("element") o‘rniga document.documentElement dan foydalaning. Bu misolda to‘liq ekran rejimidan chiqish uchun yopish funksiyasidan ham foydalanamiz:
Misol
<script>
/* Get the documentElement (<html>) to display the page in fullscreen */
var elem = document.documentElement;
/* View in fullscreen */
function openFullscreen() {
if (elem.requestFullscreen) {
elem.requestFullscreen();
} else if (elem.webkitRequestFullscreen) { /* Safari */
elem.webkitRequestFullscreen();
} else if (elem.msRequestFullscreen) { /* IE11 */
elem.msRequestFullscreen();
}
}
/* Close fullscreen */
function closeFullscreen() {
if (document.exitFullscreen) {
document.exitFullscreen();
} else if (document.webkitExitFullscreen) { /* Safari */
document.webkitExitFullscreen();
} else if (document.msExitFullscreen) { /* IE11 */
document.msExitFullscreen();
}
}
</script>
Sahifa to‘liq ekran rejimida bo‘lganda uni bezash uchun CSS’dan ham foydalanishingiz mumkin:
Misol
/* Safari */
:-webkit-full-screen {
background-color: yellow;
}
/* IE11 */
:-ms-fullscreen {
background-color: yellow;
}
/* Standard syntax */
:fullscreen {
background-color: yellow;
}
O‘zingiz sinab ko‘ring »
Tegishli sahifalar
HTML DOM ma’lumotnomasi: requestFullscreen() metodi.
HTML DOM ma’lumotnomasi: exitFullscreen() metodi.
HTML DOM ma’lumotnomasi: documentElement xususiyati.
W3Schools Pathfinder
Yutuqlaringizni kuzating – bu bepul!