Videojs仅添加播放控件 [英] Videojs add only play control

问题描述

我正在使用 Video.js 在我的网页上播放视频。
我想自定义播放器控件只播放按钮。

I am using Video.js to play videos in my web page. I want to customize player controls to only play button.

我的代码是

<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>

任何人都可以指导玩家自定义吗？

Can any one guide me in player customization?

推荐答案

我发现的最简单的方法是修改类的原型。

The easiest way I have found is modifying the prototype for the class as such.

插入

<script>
    _V_.ControlBar.prototype.options.components = {'playToggle':{}}
</script>

紧跟在

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

除了播放切换按钮之外，这将删除每个控件（包括持续时间，剩余时间和搜索栏）

This will remove every control ( including the duration, time remaining and seek bar ) besides the play toggle button

如果您想要其他东西，可以选择默认设置（其中一些设置为隐藏在默认皮肤上）

If you would like other things, you may pick and choose from the defaults (a few of these are set to hidden on the default skin)

options: {
    components: {
        "playToggle": {},
        "fullscreenToggle": {},
        "currentTimeDisplay": {},
        "timeDivider": {},
        "durationDisplay": {},
        "remainingTimeDisplay": {},
        "progressControl": {},
        "volumeControl": {},
        "muteToggle": {}
    }
}

或者浏览git hub上的controls.js文件
https://github.com/zencoder/video-js/blob/master/src/controls.js

Or dig through the controls.js file on git hub https://github.com/zencoder/video-js/blob/master/src/controls.js

这篇关于Videojs仅添加播放控件的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！