使用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) } }
你要觉得这篇文章比较好,记得点推荐!