Question

我遇到了HTML 5视频控件的问题，可以在以下位置查看：

http://www.filmsbyben.com/projects/beannchor/

在Chrome和Safari中，它可以正确显示，没有播放器控件和允许视频播放的大型播放按钮。无论何时在Firefox中查看，视频控件都会显示。

我在CSS中添加了以下代码，这些代码是控件无法显示但不适用于Firefox的原因：

video::-webkit-media-controls-panel {
  display: none;
  -webkit-appearance: none;
}
video::-webkit-media-controls-play-button {
  display: none;
  -webkit-appearance: none;
}
video::-webkit-media-controls-start-playback-button {
  display: none;
  -webkit-appearance: none
}

video::-webkit-media-controls {
  display: none;
  -webkit-appearance: none;
}

我还在视频广告代码中添加了controls="false"，与Firefox无关。

非常感谢任何帮助。

Answer 1

删除视频代码的controls属性，如下所示：

<video onended="videoEnded(this)" poster="http://www.filmsbyben.com/wp-content/uploads/2016/05/Beannchor-1.jpg" class="full-video video-button-fade" id="video-button-fade">
     <source onended="videoEnded(this)" type="video/mp4" poster="http://www.filmsbyben.com/wp-content/uploads/2016/05/Beannchor-1.jpg" src="https://player.vimeo.com/external/133027081.hd.mp4?s=6e831cbf174dc8d972293b3275a3b34711904df8&amp;profile_id=113"></source>
            Your browser does not support the video tag.
</video>

HTML5视频控件隐藏在Chrome和Safari中，但不存在于Firefox中

1 个答案: