esc exits full screen, the video player does not shrink

esc exits full screen, and keydown and keyup events are not monitored.

esc exits full screen, the video player does not shrink

The above problems are all caused by pressing esc after the browser is full screen and no keyboard events are heard in the page. Here we can listen to the resize event.

Directly upload the code, taking vue2 as an example

methods: { 
 checkFull () {
      let isFull = document.mozFullScreen ||
          document.fullScreen ||
          document.webkitIsFullScreen ||
          document.webkitRequestFullScreen ||
          document.mozRequestFullScreen ||
          document.msFullscreenEnabled
      if (isFull === undefined) {
        isFull = false
      }
      return isFull
    }
},
mounted () {
    const that = this
    window.onresize = function () {
      if (!that.checkFull()) {
        // 执行退出全屏的操作 例如:视频播放器退出全屏
      }
    }
}

Guess you like

Origin blog.csdn.net/qq_39078783/article/details/131174207