使用js来执行全屏

 

当用户按下F11事件，浏览器为触发自身全屏功能，这个过程我们一般是不可控制的，即使是监听了F11的键盘事件，退出全屏的时候，我们也捕捉不到退出全屏触发的事件。所以，我们就用程序自己去实现F11的功能，首先需要禁用浏览器默认的事件动作。

$(document).on('keydown', function (e) {
     var e = event || window.event || arguments.callee.caller.arguments[0];
     if(e && e.keyCode == 122){//捕捉F11键盘动作
       e.preventDefault();  //阻止F11默认动作
       var el = document.documentElement;
       var rfs = el.requestFullScreen || el.webkitRequestFullScreen || el.mozRequestFullScreen || el.msRequestFullScreen;//定义不同浏览器的全屏API
　　　　　　//执行全屏
       if (typeof rfs != "undefined" && rfs) {
             rfs.call(el);
       } else if(typeof window.ActiveXObject != "undefined"){
             var wscript = new ActiveXObject("WScript.Shell");
             if (wscript!=null) {
                 wscript.SendKeys("{F11}");
             }
       }
　　　　　　//监听不同浏览器的全屏事件，并件执行相应的代码
       document.addEventListener("webkitfullscreenchange", function() {//
           if (document.webkitIsFullScreen) {
                //全屏后要执行的代码
           }else{
                //退出全屏后执行的代码
       　　}
       }, false);

       document.addEventListener("fullscreenchange", function() {
           if (document.fullscreen) {
                //全屏后执行的代码
           }else{
                //退出全屏后要执行的代码
           }
       }, false);

       document.addEventListener("mozfullscreenchange", function() {
           if (document.mozFullScreen) {
                //全屏后要执行的代码
           }else{
                //退出全屏后要执行的代码
           }
       }, false);

       document.addEventListener("msfullscreenchange", function() {
           if (document.msFullscreenElement) {
                //全屏后要执行的代码
           }else{
                //退出全屏后要执行的代码
           }
       }, false)
    }
}