日韩av黄I国产麻豆传媒I国产91av视频在线观看I日韩一区二区三区在线看I美女国产在线I麻豆视频国产在线观看I成人黄色短片

歡迎訪問 生活随笔！

生活随笔

當前位置： 首頁 >

JS控制网页全屏

發布時間：2023/12/13 34 豆豆
生活随笔 收集整理的這篇文章主要介紹了 JS控制网页全屏 小編覺得挺不錯的,現在分享給大家,幫大家做個參考.

在谷歌，IE等瀏覽器中，點擊F11按鍵會進入網頁全屏模式，如同看電影的劇場模式，這個在代碼中可以通過JS來實現，簡單說下在實現這個需求后的個人總結：
底層網頁是已經加載完畢的，這時我們需要的全屏其實就是對底層網頁的放大處理，所以采用這種方式來做成全屏效果，你的前提是有底層的網頁dom,然后對這個dom進行全屏處理。

代碼：

<body><button id='btn'>進入全屏</button> <!-- 對這個div 進行全屏處理 一開始對全屏處理的dom進行隱藏(display: none;)，不隱藏也是可以的，看個人需求--><div id="content" style="background:#333;width:100%;height:100%;display: none;"> <div id="quite" class="btn"><span style="color:#FFF">退出全屏</span></div> </div> </body> <script type="text/javascript">var content = document.getElementById('content'); $("#btn").click(function(){ //全屏處理前，將隱藏dom秀出來$("#content").show();fullScreen(content); });var quite = document.getElementById('quite'); $("#quite").click(function(){ exitFullScreen();//隱藏dom$("#content").hide();}); //進入全屏function fullScreen(el) { var rfs = el.requestFullScreen || el.webkitRequestFullScreen || el.mozRequestFullScreen || el.msRequestFullScreen, wscript; if(typeof rfs != "undefined" && rfs) { rfs.call(el); return; } if(typeof window.ActiveXObject != "undefined") { wscript = new ActiveXObject("WScript.Shell"); if(wscript) { wscript.SendKeys("{F11}"); } } } //退出全屏function exitFullScreen() { var el= document, cfs = el.cancelFullScreen || el.webkitCancelFullScreen || el.mozCancelFullScreen || el.exitFullScreen, wscript; if (typeof cfs != "undefined" && cfs) { cfs.call(el); return; } if (typeof window.ActiveXObject != "undefined") { wscript = new ActiveXObject("WScript.Shell"); if (wscript != null) { wscript.SendKeys("{F11}"); } } } </script>

文章不足之處，望提出，謝謝..

轉載于:https://www.cnblogs.com/wangqilong/p/9417502.html

總結

以上是生活随笔為你收集整理的JS控制网页全屏的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。