手机
当前位置:查字典教程网 >编程开发 >Javascript教程 >JS 全屏和退出全屏详解及实例代码
JS 全屏和退出全屏详解及实例代码
摘要:JS全屏和退出全屏js实现浏览器窗口全屏和退出全屏的功能,市面上主流浏览器如:谷歌、火狐、360等都是兼容的,不过IE低版本有点瑕疵(全屏状...

JS 全屏和退出全屏

js实现浏览器窗口全屏和退出全屏的功能,市面上主流浏览器如:谷歌、火狐、360等都是兼容的,不过IE低版本有点瑕疵(全屏状态下仍有底部的状态栏)。

这个demo基本是够了,直接复制下面的源码另存为html文件看效果吧。

<!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>全屏显示</button> <button>退出全屏</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}"); } } }

//退出全屏 判断浏览器种类

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>

感谢阅读,希望嫩帮助到大家,谢谢大家对本站的支持!

【JS 全屏和退出全屏详解及实例代码】相关文章:

jQuery实现的多屏图像图层切换效果实例

强制设为首页代码

JQuery分屏指示器图片轮换效果实例

JS实现简洁、全兼容的拖动层实例

js实现简单锁屏功能实例

JS创建对象几种不同方法详解

JQuery自动触发事件的方法

在页面中输出当前客户端时间javascript实例代码

JavaScript 预解析的原理及实现

JavaScript实现Flash炫光波动特效

精品推荐
分类导航