html - 隐藏在Chrome和Safari中但未隐藏在Firefox中的HTML5视频控件

我在使用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无关。

任何帮助将不胜感激。

最佳答案

删除视频标签的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>