h5页面实现浏览器全屏显示

  • Post author:
  • Post category:其他



目录


开启全屏显示


退出全屏显示


获取当前是否全屏状态


开启全屏显示

let el = document.documentElement;
// 不同浏览器兼容方法调用
if(el.requestFullScreen){
  el.requestFullScreen();
}else if(el.webkitRequestFullScreen){
  el.webkitRequestFullScreen();
}else if(el.mozRequestFullScreen){
  el.mozRequestFullScreen();
}else if(el.msRequestFullScreen){
  el.msRequestFullScreen();
}

退出全屏显示

if (document.exitFullscreen) {
   document.exitFullscreen();
} else if (document.mozCancelFullScreen) {
   document.mozCancelFullScreen();
} else if (document.webkitCancelFullScreen) {
  document.webkitCancelFullScreen();
} else if (document.msCancelFullScreen) {
  document.msCancelFullScreen();
}

获取当前是否全屏状态

if(document.fullscreenElement || document.webkitFullScreenElement || document.mozFullScreenElement || document.msFullScreenElement){
   alert('当前是全屏')
}else{
   alert('当前非全屏')
}



版权声明:本文为bangbDIV原创文章,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接和本声明。