三脚猫

如何向全屏的video上盖东西?

2019-08-21  本文已影响0人  DADFAD

答案是:盖不住。

唯有曲线救国,video使用流式布局,将video的父元素进行全屏处理,之后就可以愉快地往视频上面盖东西了。

 // 兼容请求视频全屏
function requestFullscreen(elem) {
  if (elem.requestFullscreen) {
    elem.requestFullscreen();
  } else if (elem.msRequestFullscreen) {
    elem.msRequestFullscreen();
  } else if (elem.mozRequestFullScreen) {
    elem.mozRequestFullScreen();
  } else if (elem.webkitRequestFullscreen) {
    elem.webkitRequestFullscreen();
  } else {
    console.error('requestFullScreen is not exist in target');
  }
}

// 用于兼容请求退出全屏
function exitFullscreen(): void {
  const _document: any = document;
  if (_document.exitFullscreen) {
    _document.exitFullscreen();
  } else if (_document.msExitFullscreen) {
    _document.msExitFullscreen();
  } else if (_document.mozCancelFullScreen) {
    _document.mozCancelFullScreen();
  } else if (_document.oRequestFullscreen) {
    _document.oCancelFullScreen();
  } else if (_document.webkitExitFullscreen) {
    _document.webkitExitFullscreen();
  }
}
上一篇下一篇

猜你喜欢

热点阅读