Ausführliche Erklärung und Beispielcode für JS im Vollbildmodus und Beenden des Vollbildmodus
- 高洛峰Original
- 2016-12-07 15:09:401357Durchsuche
JS Vollbild und Vollbild beenden
js realisiert die Vollbild- und Vollbild-Beendigungsfunktionen des Browserfensters. Mainstream-Browser auf dem Markt wie Google, Firefox, 360 usw. sind alle kompatibel. Die niedrigere Version des IE weist jedoch einige Mängel auf (im Vollbildmodus befindet sich unten immer noch eine Statusleiste).
Diese Demo reicht im Grunde aus. Kopieren Sie einfach den Quellcode unten und speichern Sie ihn als HTML-Datei, um den Effekt zu sehen.
<!DOCTYPE html>
<html>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>js全屏和退出全屏代码</title>
<body>
<!-- requestFullScreen(document.documentElement): 整个网页进入全屏
requestFullScreen(document.getElementById("video-box")): 指定某块区域全屏
-->
<button onclick="requestFullScreen(document.documentElement)">全屏显示</button>
<button onclick="exitFull()">退出全屏</button>
</body>
<script type="text/javascript">
function requestFullScreen(element) {
// 判断各种浏览器，找到正确的方法
var requestMethod = element.requestFullScreen || //W3C
element.webkitRequestFullScreen || //Chrome等
element.mozRequestFullScreen || //FireFox
element.msRequestFullScreen; //IE11
if (requestMethod) {
requestMethod.call(element);
}
else if (typeof window.ActiveXObject !== "undefined") {//for Internet Explorer
var wscript = new ActiveXObject("WScript.Shell");
if (wscript !== null) {
wscript.SendKeys("{F11}");
}
}
}
//Vollbildmodus verlassen und Browsertyp bestimmen
function exitFull() {
// 判断各种浏览器，找到正确的方法
var exitMethod = document.exitFullscreen || //W3C
document.mozCancelFullScreen || //Chrome等
document.webkitExitFullscreen || //FireFox
document.webkitExitFullscreen; //IE11
if (exitMethod) {
exitMethod.call(document);
}
else if (typeof window.ActiveXObject !== "undefined") {//for Internet Explorer
var wscript = new ActiveXObject("WScript.Shell");
if (wscript !== null) {
wscript.SendKeys("{F11}");
}
}
}
</script>
</html>
Stellungnahme：
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Vorheriger Artikel：So implementieren Sie die automatische Höhe der JQuery-TextfüllungNächster Artikel：So implementieren Sie die automatische Höhe der JQuery-Textfüllung