添加自定义控件以响应 video.js 控件的活动状态

【问题标题】：add custom controls to respond with the active state of video.js controls添加自定义控件以响应 video.js 控件的活动状态
【发布时间】：2021-02-04 06:22:37
【问题描述】：

我正在使用 video.js 播放我的 *.hls 文件，并且我正在使用它们的默认皮肤。我使用 JavaScript、HTML 和 CSS 为视频添加了退出控件。我希望在用户处于非活动状态时退出控件与视频控件一起消失。我该怎么做？我是在元素中添加一些类还是在js中添加一些代码？showing the default video controls from video.js and I add an exit control at the top

【问题讨论】：

标签： javascript html video video.js

【解决方案1】：

有多种方法可以做到这一点。

据我了解，使用“useractive”和“userinactive”事件来显示或隐藏您的 css 类将是最好的方法，而无需操纵 video.js 代码本身。..

如果您想自己操作代码，则可以查找 player.controlBar.fadeIn() 和 player.controlBar.fadeOut() 函数（假设 player 是视频对象..）并将您的 css 类添加到功能。

The Doc for Video.js 有一些关于我提到的事件的信息。这应该会有所帮助。

【讨论】：