全屏 HTML5 视频自定义控制器

Question

HTML5 视频全屏自定义控制器未在 Mozilla Firefox 中正确显示。

演示http://athimannil.com/player/

:-webkit-full-screen #skinn{
  width: 100%;
  height: 100%;
}
:-moz-full-screen #skinn{
  width: 100%;
  height: 100%;
}
:-ms-fullscreen #skinn{
  width: 100%;
  height: 100%;
}
:fullscreen #skinn{
  width: 100%;
  height: 100%;
}

Answer 1

您将 kuttuPlayer（即#player1）作为您的全屏元素。 #skinn 不是全屏元素的子元素。因此 CSS 选择器不匹配。不要忘记，全屏视图中可能只有 DOM 的一部分。

尝试类似：

#skinn:-moz-full-screen-ancestor {
  bottom: 0;
  position: absolute;
  width: 100%;
}