HTML5 视频全屏

Question

我尝试制作一个 HTML5 视频播放器。我已经使用 CSS 和 jQuery 创建了自定义控件。但是当我打开全屏模式时，我无法在全屏上看到我的自定义控件。

关闭全屏模式:

全屏模式开启但没有自定义控件:

Answer 1

显示自定义 Controller

请将 z-index 添加到您的自定义控件元素中

#customController{
  -------------------;
  -------------------;
  -------------------;
  z-index: 2147483647;
}

隐藏原生 Controller

video::-webkit-media-controls {
  display:none !important;
}
video::-webkit-media-controls-enclosure {
  display:none !important;
}