js模拟F11全屏功能
html部分:
<div class="help ml20" @click="fullScreen"> <i class="el-icon-full-screen sideBar-el-icon"></i> </div>
js部分(isFllScreen是判断是否开了全屏用的变量):
fullScreen() { let docElm = document.documentElement; if (this.isFllScreen) { if (document.exitFullscreen) { document.exitFullscreen(); } else if (document.mozCancelFullScreen) { document.mozCancelFullScreen(); } else if (document.webkitCancelFullScreen) { document.webkitCancelFullScreen(); } else if (document.msExitFullscreen) { document.msExitFullscreen(); } this.isFllScreen = false } else { //W3C if (docElm.requestFullscreen) { docElm.requestFullscreen(); } //FireFox else if (docElm.mozRequestFullScreen) { docElm.mozRequestFullScreen(); } //Chrome等 else if (docElm.webkitRequestFullScreen) { docElm.webkitRequestFullScreen(); } this.isFllScreen = true } }
效果: