html5 自带全屏API调用方法

function FullScreen(){
          var el = $('html')[0];//要全屏的元素,如果要全页面全屏,建议使用html节点而不是body节点
          var isFullscreen=document.fullScreen||document.mozFullScreen||document.webkitIsFullScreen;
          if(!isFullscreen){//进入全屏,多重短路表达式
              (el.requestFullscreen&&el.requestFullscreen())||
              (el.mozRequestFullScreen&&el.mozRequestFullScreen())||
              (el.webkitRequestFullscreen&&el.webkitRequestFullscreen())||(el.msRequestFullscreen&&el.msRequestFullscreen());
          }else{    //退出全屏,三目运算符
              document.exitFullscreen?document.exitFullscreen():
              document.mozCancelFullScreen?document.mozCancelFullScreen():
              document.webkitExitFullscreen?document.webkitExitFullscreen():'';
          }
 }

直接调用该方法即可。

使用esc键退出全屏。

此方法的全屏和F11的全屏还是有区别的。

posted on 2018-05-08 11:29  parker_yu  阅读(311)  评论(0编辑  收藏  举报

导航