js之切换全屏和退出全屏实现
Posted youcong
tags:
篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了js之切换全屏和退出全屏实现相关的知识,希望对你有一定的参考价值。
应用场景:
比如很多网页游戏全屏之类的,或者是网上看小说等。
核心代码:
//控制全屏 function enterfullscreen() //进入全屏 $("#fullscreen").html("退出全屏"); var docElm = document.documentElement; //W3C if(docElm.requestFullscreen) docElm.requestFullscreen(); //FireFox else if(docElm.mozRequestFullScreen) docElm.mozRequestFullScreen(); //Chrome等 else if(docElm.webkitRequestFullScreen) docElm.webkitRequestFullScreen(); //IE11 else if(elem.msRequestFullscreen) elem.msRequestFullscreen(); function exitfullscreen() //退出全屏 $("#fullscreen").html("切换全屏"); if(document.exitFullscreen) document.exitFullscreen(); else if(document.mozCancelFullScreen) document.mozCancelFullScreen(); else if(document.webkitCancelFullScreen) document.webkitCancelFullScreen(); else if(document.msExitFullscreen) document.msExitFullscreen(); var a = 0; $(‘#fullscreen‘).on(‘click‘, function() a++; a % 2 == 1 ? enterfullscreen() : exitfullscreen(); )
前端代码:
<a type="button" id="fullscreen" class="btn btn-default visible-lg visible-md"><i class="fa fa-refresh" aria-hidden="true"></i> 切换全屏</a>
以上是关于js之切换全屏和退出全屏实现的主要内容,如果未能解决你的问题,请参考以下文章