页面 全屏显示

<html>    
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />   
<script language="JavaScript">    
function fg(){


alert();
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();
    }
}
</script>  
<body onload="fg()">    
<div style="margin:0 auto;height:600px;width:700px;">  
<button id="btn" onclick="fg()" >js控制页面的全屏展示和退出全屏显示</button>    
<div id="content" style="margin:0 auto;height:500px;width:700px; background:#ccc;" >  
<h1>js控制页面的全屏展示和退出全屏显示</h1>    
</div>  
</div>    
</body> 
<style type="text/css">
#content:-webkit-full-screen {
    background-color:rgb(255, 255, 12);
}
</style>
  
</html>

猜你喜欢

转载自blog.csdn.net/weibingbing_net/article/details/80244533