浏览器自动全屏功能

672 阅读1分钟

需求:实现浏览器输入地址后直接全屏

浏览器的机制不允许一打开网页就全屏显示,全屏的功能需要用户去点击、触摸等操作才能实现,写到这可能有人会想那就写个按钮,让它自动触发呀,想到这个的人真聪明,但是呢,尝试了也不行,所以浏览器是不允许用户自动去全屏的,这是我自己百度的结果,如果有人有不同的看法,欢迎评论~~

下面附上我的全屏显示的代码吧

打开全屏

requestFullscreen() {
    const docElm = document.documentElement
    if (docElm.requestFullscreen) {
      docElm.requestFullscreen()
    } else if (docElm.msRequestFullscreen) {
      docElm.msRequestFullscreen()
    } else if (docElm.mozRequestFullScreen) {
      docElm.mozRequestFullScreen()
    } else if (docElm.webkitRequestFullScreen) {
      docElm.webkitRequestFullScreen()
    }
  }

关闭全屏

exitFullScreen() {
    if (document.exitFullscreen) {
      document.exitFullscreen()
    } else if (document.msExitFullscreen) {
      document.msExitFullscreen()
    } else if (document.mozCancelFullScreen) {
      document.mozCancelFullScreen()
    } else if (document.webkitCancelFullScreen) {
      document.webkitCancelFullScreen()
    }
  }