javascript實現的控制瀏覽器全屏效果 [

antzone發表於2017-04-03

點選F11鍵能夠實現瀏覽器的全屏效果。

當然這個效果也是可以用js實現,下面就是相關程式碼,需要的朋友可以做一下參考。

程式碼如下:

[HTML] 純文字檢視 複製程式碼
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<meta name="author" content="http://www.softwhy.com/" />
<title>螞蟻部落</title>
<style>
div{
  margin:0 auto;
  height:600px;
  width:700px;
}
#content{
  margin:0 auto;
  height:500px;
  width:700px; 
  background:#ccc;
}
</style>
<script>
function requestFullScreen(element){    
  var requestMethod=element.requestFullScreen 
  || element.webkitRequestFullScreen 
  || element.mozRequestFullScreen 
  || element.msRequestFullScreen;    
  if(requestMethod){      
    requestMethod.call(element);    
  } 
  else if (typeof window.ActiveXObject !== "undefined"){      
    var wscript = new ActiveXObject("WScript.Shell");    
    if (wscript !== null) {    
      wscript.SendKeys("{F11}");    
    }    
  }    
}  
window.onload=function(){
  document.getElementById("btn").onclick=function(){     
    var elem = document.getElementById("content");      
    requestFullScreen(elem);     
  };  
}  
</script>  
</head>   
<body>    
<div>  
<button id="btn">檢視效果</button>    
<div id="content">  
  <h1>本站的地址是softwhy.com</h1>    
</div>  
</div>    
</body>      
</html>

相關文章