实现网页全屏和退出全屏JS代码，多浏览器兼容

江山如画 • 2019年2月15日下午1:55 • 网页制作 • 阅读 5322

实现网页全屏和退出全屏JS代码，兼容主流浏览器如：谷歌、火狐、360等。

<!DOCTYPE html> <html> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>js全屏和退出全屏代码|www.125jz.com</title> <body>  <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}"); } } } //退出全屏判断浏览器种类 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>

Tips:You can change the code before run.

还可以根据注释，实现整个网页进入全屏，还是指定某块区域全屏（根据区域ID指定），快来试试吧。

125jz网原创文章。发布者：江山如画，转载请注明出处：http://www.125jz.com/3262.html

赞 (0)

江山如画管理团队

微信扫一扫

微信扫一扫

支付宝扫一扫

支付宝扫一扫

js实现进度拖拽的效果-调节音量

js实现进度拖拽的效果-调节音量

上一篇 2019年2月15日下午1:48

jquery动态新增元素节点.click点击事件失效的2个解决方法

jquery动态新增元素节点.click点击事件失效的2个解决方法

下一篇 2019年2月16日下午9:19

网页制作

FLV视频播放代码及Flvplayer.swf播放器下载

FLV是被众多新一代视频分享网站所采用，是目前增长最快、最为广泛的视频传播格式。 FLV 是FLASH VIDEO的简称，它形成的文件极小、加载速度极快，有效地解决了视频文件在网络上很好的使用等问题。下面分享在网页制作时，插入FLV格式视频的代码（兼容主流浏览器）： <object class id=”clsid:D27CDB6E-AE6D-11cf…

江山如画
2018年5月14日
11.0K01
网页制作

如何在网页中输入多个连续的空格？

默认状态下（输入法为半角状态），按空格键只能输入一个空格，要在文本之间插入多个连续的空格，可以使用以下几种方法： 1) 使用Ctrl+Shift+Space组合键。 2) 在中文全角状态下，使用空格键。 3) 选择【插入】→【HTML】→【特殊字符】命令下的“不换行空格”命令。 4) 直接在代码视图输入“ ”字符。

江山如画
2020年4月3日
29.5K03
网页制作

给网页中的按钮和图片添加声音

Loud links-是一款大小只有1.5KB的WEB音效插件，可以实现网页中按钮与图片等元素的触发交互，比如鼠标放上去后出现响声，或者鼠标点击后出现响声。Loud links使用相当简单。使用方法 1. 在网页中引入JS 文件 <script src=”js/loudlinks.min.js”></script> 2. 在需要触发…

江山如画
2018年2月6日
13.3K00
Zoho Docs-在网页中嵌入PPT的最佳方案（个人版5G免费）

Zoho WorkDrive – 全面的在线共享文档工具在125建站网上想嵌入PPT，分享给大家，并且可以播放。我思考了三种方法：是在Zoho Docs上操作；是PPT以图片的形式保存（动画效果没有了），直接轮播；是自己手写动画+轮播，达到PPT播放效果（用express.js来实现）比较复杂，并且对小白站长不适用。很自信的要自己手…

江山如画
2023年1月16日 • 网页制作
2.0K00
网页制作

label文字与textarea、input垂直居中、顶部对齐的方法

在网站表单制作时label标签里的文字与Iput、textarea标签的默认对齐方式不美观，如下图。姓名：留言：中国网页设计给大家分享label文字与input、textarea垂直居中对齐和顶部对齐的简单方法。 label文字与textarea、input垂直居中的方法在input标签样式中加入css标签vertical-align: middle…

江山如画
2018年3月18日
11.7K01
网页制作

css中id和class的优先级问题，与顺序无关

id，class，style的优先级别顺序为style高于id高于class。

江山如画
2020年11月15日
17.1K00

发表回复

登录后才能评论