JS操作全屏事件

  1 $(‘.fullscreen‘).click(function(){
  2 
  3      var screen=isFull();
  4 
  5      if(screen){
  6 
  7          exitScreen();
  8 
  9      }else{
 10 
 11          fullScreen();
 12 
 13      }
 14 
 15  });
 16 
 17     
 18 
 19 //网页全屏代码
 20 
 21 function fullScreen(){
 22 
 23      //ie10以下全屏模式
 24 
 25      if(window.ActiveXObject){  
 26 
 27          var wscript = new ActiveXObject("WScript.Shell");  
 28 
 29          if(wscript){  
 30 
 31              wscript.SendKeys("{F11}");  
 32 
 33              return;
 34 
 35          }else{
 36 
 37              console.log(‘用户拒接或者加载插件失败‘);
 38 
 39          }  
 40 
 41      };  
 42 
 43      // 判断各种浏览器，找到正确的方法
 44 
 45      function fullScreen(obj) {
 46 
 47          if(obj.requestFullscreen){
 48 
 49              obj.requestFullscreen();
 50 
 51          }else if(obj.mozRequestFullScreen){
 52 
 53              obj.mozRequestFullScreen();
 54 
 55          }else if(obj.webkitRequestFullscreen){
 56 
 57              obj.webkitRequestFullscreen();
 58 
 59          }else if(obj.msRequestFullscreen){
 60 
 61              obj.msRequestFullscreen();
 62 
 63          }else{
 64 
 65            console.log(‘该浏览器不支持全屏，请升级最新版本‘);
 66 
 67          }
 68 
 69      };
 70 
 71      //启动全屏
 72 
 73      fullScreen($(‘html‘).get(0)); // 整个网页
 74 
 75     //fullScreen(document.getElementById("videoElement")); //某个页面元素
 76 
 77 };
 78 
 79 
 80 
 81 //退出全屏代码
 82 
 83 function exitScreen(){
 84 
 85     //ie10以下全屏模式
 86 
 87     if(window.ActiveXObject){  
 88 
 89         var wscript = new ActiveXObject("WScript.Shell");  
 90 
 91         if(wscript){  
 92 
 93             wscript.SendKeys("{F11}");  
 94 
 95             return;
 96 
 97         }
 98 
 99     }; 
100 
101     // 判断浏览器种类
102 
103     function exit() {
104 
105       if(document.exitFullscreen){
106 
107         document.exitFullscreen();
108 
109       }else if(document.mozCancelFullScreen){
110 
111         document.mozCancelFullScreen();
112 
113       }else if(document.webkitExitFullscreen){
114 
115         document.webkitExitFullscreen();
116 
117       }else if(document.msExitFullscreen){
118 
119         document.msExitFullscreen();
120 
121       }
122 
123     };
124 
125     // 退出全屏模式!
126 
127     exit();
128 
129 };
130 
131 
132 
133 //判断是否全屏
134 
135 function isFull(){
136 
137     var explorer = window.navigator.userAgent.toLowerCase();
138 
139     var full;
140 
141     if(explorer.indexOf(‘chrome‘)>0){//chrome
142 
143         if (document.body.scrollHeight == window.screen.height && document.body.scrollWidth == window.screen.width) {
144 
145             full=true;
146 
147         } else {
148 
149             full=false;
150 
151         }
152 
153     }else{//IE 9+  fireFox
154 
155         if (window.outerHeight == window.screen.height && window.outerWidth == window.screen.width) {
156 
157             full=true;
158 
159         } else {
160 
161             full=false;
162 
163         }
164 
165     };
166 
167     return full;
168 
169 };