请使用插件screenfull screenfull.js-github
拓展阅读：HTML5 full-screen全屏API测试实例页面
下面部分有各种问题。仅供娱乐。
经测试 下面部分代码在Chrome，Opera，Firefox下有效，Edge IE Safari无效。
全屏
var docElm = document.documentElement;
if (docElm.requestFullscreen) { //W3C
docElm.requestFullscreen();
} else if (docElm.mozRequestFullScreen) { //FireFox
docElm.mozRequestFullScreen();
} else if (docElm.webkitRequestFullScreen) { //Chrome等
docElm.webkitRequestFullScreen();
} else if (docElm.msRequestFullscreen) { //IE 11
docElm.msRequestFullscreen();
}
进阶版
var doc = document.documentElement;
(doc.requestFullscreen||doc.webkitRequestFullscreen||doc.mozRequestFullscreen||doc.msRequestFullscreen).call(doc);
退出全屏
if (document.exitFullscreen) { //W3C
document.exitFullscreen();
} else if (document.mozCancelFullScreen) { //FireFox
document.mozCancelFullScreen();
} else if (document.webkitCancelFullScreen) { //Chrome等
document.webkitCancelFullScreen();
} else if (document.msExitFullscreen) { //IE 11
document.msExitFullscreen();
}
进阶版
(document.exitFullscreen||document.mozCancelFullScreen||document.webkitCancelFullScreen||document.msExitFullscreen).call(document)
全屏状态
// true全屏，false非全屏
document.fullscreen //W3C
document.mozFullScreen //FireFox
document.webkitIsFullScreen //Chrome等
document.msFullscreenElement //IE 11
事件监听
document.onfullscreenchange //W3C
document.onmozfullscreenchange //FireFox
document.onwebkitfullscreenchange //Chrome等
document.onmsfullscreenchange //IE 11
全屏 css 样式
html:-moz-full-screen {
background:red;
}
html:-webkit-full-screen {
background:red;
}
html:fullscreen
{
background:red;
}