js实现浏览器全屏

 众所周知，IE是个奇葩的浏览器，但是由于用户量很大，开发者还是不得不为IE考虑一下，于是，各种浏览器相关的操作，都要多一个特别的判断——专门针对IE浏览器的判断，这里的全屏也不例外。看代码：

?

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28

function  fullScreen() {    var  el = document.documentElement;    var  rfs = el.requestFullScreen || el.webkitRequestFullScreen ||         el.mozRequestFullScreen || el.msRequestFullScreen;    if ( typeof  rfs !=  "undefined"  && rfs) {      rfs.call(el);    }  else  if ( typeof  window.ActiveXObject !=  "undefined" ) {      //for IE，这里其实就是模拟了按下键盘的F11，使浏览器全屏      var  wscript =  new  ActiveXObject( "WScript.Shell" );      if (wscript !=  null ) {          wscript.SendKeys( "{F11}" );      }    } } function  exitFullScreen() {    var  el = document;    var  cfs = el.cancelFullScreen || el.webkitCancelFullScreen ||         el.mozCancelFullScreen || el.exitFullScreen;    if ( typeof  cfs !=  "undefined"  && cfs) {      cfs.call(el);    }  else  if ( typeof  window.ActiveXObject !=  "undefined" ) {      //for IE，这里和fullScreen相同，模拟按下F11键退出全屏      var  wscript =  new  ActiveXObject( "WScript.Shell" );      if (wscript !=  null ) {          wscript.SendKeys( "{F11}" );      }    } }

 

    下面是个简单的例子（假设上面的代码保存在script.js文件中）：在两个按钮中调用这两个函数即可实现：

?

1 2 3 4 5 6 7 8 9 10 11

< html > < head > < script  type = "text/javascript"  src = "script.js" ></ script > </ head > < body > < div  style = "margin-top:50px" >  <!-- 设置margin-top是为了查看IE全屏前后的区别 -->    < input  type = "button"  value = "FullScreen"  onclick = "fullScreen()"  />    < input  type = "button"  value = "ExitFullScreen"  onclick = "exitFullScreen()"  /> </ div > </ body > </ html >