Videojs仅添加播放控件

我在用Video.js在我的网页中播放视频。 我想将播放器控件自定义为仅播放按钮。

我的代码是

<link href="http://vjs.zencdn.net/c/video-js.css" rel="stylesheet">

<script src="http://vjs.zencdn.net/c/video.js"></script>

<video id="my_video_1" class="video-js vjs-default-skin" controls
                    preload="auto" width="320" height="240" poster="thumb.png"
                    data-setup="{}">
                    <source src="v1.mp4" type='video/mp4'>
                    </video>

任何人都可以指导我进行玩家定制吗？

我能够做到这一点的方法是将特定控件的 css 类设置为display: none;在我页面的 CSS 中。我页面的 CSS 在 vi​​deo-js.css 链接后被链接。

/* Video.js Controls Style Overrides */
.vjs-default-skin .vjs-progress-control,
.vjs-default-skin .vjs-time-controls,
.vjs-default-skin .vjs-time-divider,
.vjs-default-skin .vjs-captions-button,
.vjs-default-skin .vjs-mute-control,
.vjs-default-skin .vjs-volume-control,
.vjs-default-skin .vjs-fullscreen-control {
    display: none;  
}

如果在链接 video-js.css 后无法链接页面的 CSS，您可以使用display: none !important;相反，这应该可以解决问题。尽管如此，我只会使用 !important 作为最后的手段。

注意：上面的内容并没有删除播放后的暂停按钮，也没有删除大播放按钮。删除这些内容时还有更多 UI 考虑因素。希望这能帮助一些人自定义 Video.js 控制栏。