zoukankan      html  css  js  c++  java
  • 使用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)
        }
    }
    

      

  • 相关阅读:
    js json和对象互相转换
    github配置和git学习
    sea.js,spm学习
    less学习-语法(二)
    less学习-浏览器端编译(一)
    grunt-mac上安装运行构建工具的总结(一)
    Advice from an Old Programmer
    scikit-FEM-例2-用Morley元在方形区域上解板弯曲问题
    scikit-FEM-例1-求解Possion边值问题
    在shell脚本中调用sqlplus 分类: H2_ORACLE 2013-06-23 13:01 1437人阅读 评论(0) 收藏
  • 原文地址:https://www.cnblogs.com/yiyi17/p/9014672.html
Copyright © 2011-2022 走看看