1. 程式人生 > >用js控制進入全屏,退出全屏

用js控制進入全屏,退出全屏

需求是這樣的 ,有一個圖示元素,點選後進入全屏,再次點選退出全屏。
實現程式碼:

<li id="fullscreen"><a href="#" ><span class="glyphicon glyphicon-resize-full "></span></a></li>
 //控制全屏
    function enterfullscreen() {//進入全屏
        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() {
//退出全屏 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(); })