html5实现网页全屏

【进入和退出全屏】

// Webkit (works in Safari5.1 and Chrome 15)
element.webkitRequestFullScreen();
document.webkitCancelFullScreen();// Firefox 10+
element.mozRequestFullScreen();
document.mozCancelFullScreen();// W3C 提议
element.requestFullscreen();
document.exitFullscreen();

【兼容解决方案】

  //进入全屏function requestFullScreen() {var de = document.documentElement;if (de.requestFullscreen) {de.requestFullscreen();} else if (de.mozRequestFullScreen) {de.mozRequestFullScreen();} else if (de.webkitRequestFullScreen) {de.webkitRequestFullScreen();}}//退出全屏
function exitFullscreen() {var de = document;if (de.exitFullscreen) {de.exitFullscreen();} else if (de.mozCancelFullScreen) {de.mozCancelFullScreen();} else if (de.webkitCancelFullScreen) {de.webkitCancelFullScreen();}
}

注：可能出于安全考虑，只能手动触发才能实现全屏，浏览器自动执行无效果。
【实例】

document.body.addEventListener('click',function(){requestFullScreen();//5秒钟自动退出全屏setTimeout(function(){exitFullscreen();},5000);

本文来自互联网用户投稿，文章观点仅代表作者本人，不代表本站立场，不承担相关法律责任。如若转载，请注明出处。 如若内容造成侵权/违法违规/事实不符，请点击【内容举报】进行投诉反馈！