• 让用户端JS触发F11全屏


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

     1 $(document).on('keydown', function (e) {
     2      var e = event || window.event || arguments.callee.caller.arguments[0];
     3      if(e && e.keyCode == 122){//捕捉F11键盘动作
     4        e.preventDefault();  //阻止F11默认动作
     5        var el = document.documentElement;
     6        var rfs = el.requestFullScreen || el.webkitRequestFullScreen || el.mozRequestFullScreen || el.msRequestFullScreen;//定义不同浏览器的全屏API
          //执行全屏
    7 if (typeof rfs != "undefined" && rfs) { 8 rfs.call(el); 9 } else if(typeof window.ActiveXObject != "undefined"){ 10 var wscript = new ActiveXObject("WScript.Shell"); 11 if (wscript!=null) { 12 wscript.SendKeys("{F11}"); 13 } 14 }
          //监听不同浏览器的全屏事件,并件执行相应的代码
    15 document.addEventListener("webkitfullscreenchange", function() {// 16 if (document.webkitIsFullScreen) { 17 //全屏后要执行的代码 18 }else{ 19 //退出全屏后执行的代码 20   } 21 }, false); 22 23 document.addEventListener("fullscreenchange", function() { 24 if (document.fullscreen) { 25 //全屏后执行的代码 26 }else{ 27 //退出全屏后要执行的代码 28 } 29 }, false); 30 31 document.addEventListener("mozfullscreenchange", function() { 32 if (document.mozFullScreen) { 33 //全屏后要执行的代码 34 }else{ 35 //退出全屏后要执行的代码 36 } 37 }, false); 38 39 document.addEventListener("msfullscreenchange", function() { 40 if (document.msFullscreenElement) { 41 //全屏后要执行的代码 42 }else{ 43 //退出全屏后要执行的代码 44 } 45 }, false) 46 } 47 }
    *********************************** Ahthor: Scot Wang Mail: wxg1837@qq.com QQ: 244821681 ***********************************
  • 相关阅读:
    ubuntu sudo 号令有效处理
    shell脚本的主笔、存储、实行
    Oracle 11gR1中细粒度访谒收集处事(4)
    Solaris效力经管工具 SMF快速入门指南(1)
    Solaris 10完成宁静Kerberos身份验证(2)
    高质量C /C编程指南第2章 程序的版式
    Solaris 10下设置EJB 3.0景遇(1)
    高质量C /C编程指南序言
    Java学习之路:不走弯路,就是捷径 www.51testing.com
    两个结构体可以直接赋值吗? 回复 "JohnsonAnother" 的问题
  • 原文地址:https://www.cnblogs.com/scot/p/5552051.html
Copyright © 2020-2023  润新知