js 实现各浏览器全屏

最新推荐文章于 2023-04-24 10:12:48 发布

转载最新推荐文章于 2023-04-24 10:12:48 发布 · 112 阅读

0 ·

CC 4.0 BY-SA版权

原文链接：http://www.cnblogs.com/wm218/p/10106570.html

文章标签：

#javascript #shell #ViewUI

本文介绍了一种在现代浏览器中实现网页全屏显示及退出全屏的方法，通过JavaScript代码调用不同浏览器的全屏API，同时提供了一个针对IE低版本的全屏解决方案。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

转载：https://blog.youkuaiyun.com/m0_37885651/article/details/79231670

 1 <!DOCTYPE html>
 2 <html>
 3     <head>
 4         <meta charset="UTF-8">
 5         <title></title>
 6     </head>
 7     <body>
 8         <button onclick="fullScreen()">现代浏览器全屏</button>
 9 
10         <button onclick="exitScreen()">现代浏览器退出</button>
11 
12         <button onclick="iefull()">低版本ie全屏</button>
13     </body>
14     <script src="js/jquery-2.1.1.js" type="text/javascript" charset="utf-8"></script>
15     <script type="text/javascript">
16         //全屏
17         function fullScreen(){
18             var el = document.documentElement;
19             var rfs = el.requestFullScreen || el.webkitRequestFullScreen || el.mozRequestFullScreen || el.msRequestFullscreen;      
20                 if(typeof rfs != "undefined" && rfs) {
21                     rfs.call(el);
22                 };
23               return;
24         }
25         //退出全屏
26         function exitScreen(){
27             if (document.exitFullscreen) {  
28                 document.exitFullscreen();  
29             }  
30             else if (document.mozCancelFullScreen) {  
31                 document.mozCancelFullScreen();  
32             }  
33             else if (document.webkitCancelFullScreen) {  
34                 document.webkitCancelFullScreen();  
35             }  
36             else if (document.msExitFullscreen) {  
37                 document.msExitFullscreen();  
38             } 
39             if(typeof cfs != "undefined" && cfs) {
40                 cfs.call(el);
41             }
42         }
43         //ie低版本的全屏，退出全屏都这个方法
44         function iefull(){
45             var el = document.documentElement;
46             var rfs =  el.msRequestFullScreen;
47             if(typeof window.ActiveXObject != "undefined") {
48                 //这的方法 模拟f11键，使浏览器全屏
49                 var wscript = new ActiveXObject("WScript.Shell");
50                 if(wscript != null) {
51                     wscript.SendKeys("{F11}");
52                 }
53             }
54         }
55         //注：ie调用ActiveX控件，需要在ie浏览器安全设置里面把 ‘未标记为可安全执行脚本的ActiveX控件初始化并执行脚本’ 设置为启用
56     </script>
57 </html>