显示视频的当前时间，而不是 videojs 上的剩余时间答案

【问题标题】：Show the current time of the video, instead of the remaining time on videojs显示视频的当前时间，而不是 videojs 上的剩余时间
【发布时间】：2013-02-25 18:31:59
【问题描述】：

我使用的是VideoJS，一个 HTML5 视频播放器

默认显示剩余时间（倒计时）而不是正常的当前时间（如 youtube）

任何想法如何“修复”它？你可以在their official website看到一个活生生的例子

【问题讨论】：

标签： time video.js

【解决方案1】：

对于寻找解决方案的其他人...

播放器上存在所有计时器，但默认情况下 current-time、time-divider 和 duration 信息隐藏与 display: none;。

所以我们唯一要做的就是隐藏remaining-time并显示time-control，其中包括current-time、time-divider和@ 987654331@.

CSS 代码 中应该适用于您的播放器的解决方案：

.video-js .vjs-time-control {
    display: block;
}
.video-js .vjs-remaining-time {
    display: none;
}

文档没有解释这一点，或者准确地说，它在解释如何使用 CSS 自定义播放器时没有解释它。

快速html代码sn-p：

<style type="text/css">
    .video-js .vjs-time-control{display:block;}
    .video-js .vjs-remaining-time{display: none;}
</style>

【讨论】：

对我来说，我没有更改.vjs-time-control，而是更改了.vjs-current-time，这解决了我的问题
它显示vjs-time-control，但是没有时间：“/”

【解决方案2】：

简单的方法是更改默认的 ControlBar.prototype.options

ControlBar.prototype.options_ = {
  children: ['playToggle', 'volumePanel', 'currentTimeDisplay', 'timeDivider', 'durationDisplay', 'progressControl', 'liveDisplay', 'remainingTimeDisplay', 'customControlSpacer', 'playbackRateMenuButton', 'chaptersButton', 'descriptionsButton', 'subsCapsButton', 'audioTrackButton', 'fullscreenToggle']
};

改成

ControlBar.prototype.options_ = {
  loadEvent: 'play',
  children: ['playToggle', 'volumeMenuButton', 'currentTimeDisplay', 'progressControl', 'liveDisplay', 'durationDisplay', 'customControlSpacer', 'playbackRateMenuButton', 'chaptersButton', 'subtitlesButton', 'captionsButton', 'fullscreenToggle']
};

最终显示时间控制

<style type="text/css">
    .video-js .vjs-time-control{display:block;}
</style>

结果：https://i.stack.imgur.com/7Vvxm.png

【讨论】：

新版本可以参考这个答案：stackoverflow.com/questions/45727017/…