Javascript VideoJS:保持控件可见

Javascript VideoJS:保持控件可见,javascript,html,video.js,Javascript,Html,Video.js,我喜欢videoJS,但找不到一种方法使控制栏始终可见(播放时不褪色)。 我搜索了相关信息,发现他们建议覆盖函数隐藏,如下所示: /覆盖控件自动隐藏fn/ 隐藏=函数(){/*无*/} 但这可能已经过时了,因为它在这里不起作用。(3.2.0版) 有人知道我是如何做到这一点的吗 非常感谢 从.vjs淡出和.vjs默认皮肤中注释/删除可见性:隐藏和不透明度:0规则。vjs控制video-js.css中的类 .vjs-fade-out { /*visibility: hidden!import

我喜欢videoJS,但找不到一种方法使控制栏始终可见(播放时不褪色)。 我搜索了相关信息,发现他们建议覆盖函数隐藏,如下所示:

/覆盖控件自动隐藏fn/

隐藏=函数(){/*无*/}

但这可能已经过时了,因为它在这里不起作用。(3.2.0版)

有人知道我是如何做到这一点的吗


非常感谢

.vjs淡出
.vjs默认皮肤中注释/删除
可见性:隐藏
不透明度:0
规则。vjs控制video-js.css中的类

.vjs-fade-out {
    /*visibility: hidden!important;
    opacity: 0!important;*/
    -webkit-transition: visibility 0s linear 1.5s,opacity 1.5s linear;
    -moz-transition: visibility 0s linear 1.5s,opacity 1.5s linear;
    -ms-transition: visibility 0s linear 1.5s,opacity 1.5s linear;
    -o-transition: visibility 0s linear 1.5s,opacity 1.5s linear;
    transition: visibility 0s linear 1.5s,opacity 1.5s linear
}

.vjs-default-skin .vjs-controls {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    margin: 0;
    padding: 0;
    height: 2.6em;
    color: #fff;
    border-top: 1px solid #404040;
    background: #242424;
    background: -moz-linear-gradient(top,#242424 50%,#1f1f1f 50%,#171717 100%);
    background: -webkit-gradient(linear,0% 0,0% 100%,color-stop(50%,#242424),color-stop(50%,#1f1f1f),color-stop(100%,#171717));
    background: -webkit-linear-gradient(top,#242424 50%,#1f1f1f 50%,#171717 100%);
    background: -o-linear-gradient(top,#242424 50%,#1f1f1f 50%,#171717 100%);
    background: -ms-linear-gradient(top,#242424 50%,#1f1f1f 50%,#171717 100%);
    background: linear-gradient(top,#242424 50%,#1f1f1f 50%,#171717 100%);
    /*visibility: hidden;
    opacity: 0*/
}

谢谢!我找到了另一个解决办法, 因为我想避免破坏原始文件, 添加这是我的CSS:

.vjs-fade-in,.vjs-fade-out {
visibility: visible !important;
opacity: 1 !important;
transition-duration: 0s!important;
}

谢谢

我知道这个问题已经问了好几年了,但我也需要这样做,上面的答案将控制放在视频的顶部。我在自己的CSS文件中使用了以下CSS来覆盖videoJS样式,以在视频开始播放后保持控件可见,并将它们保持在视频下方

.vjs-default-skin.vjs-has-started .vjs-control-bar {
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
  bottom: -3.4em !important;
  background-color: rgba(7, 20, 30, 1) !important;
}

这里还有一点巫术

虽然Peter Kitts的最后一个答案很好,但另一个选项是将
inactivityTimeout
设置为0,这将完全禁用非活动超时



我不喜欢我们首先必须这样做,但感谢您的解决方案;)这似乎是最好的方法,但我认为真正需要的行是
opacity:1!重要的
可见性:可见!重要的,对吗?“底部”规则将控件保持在视频的下方而不是上方,而“显示”则克服了可能的“显示:无”。我认为您的方法是最好的,使用videojs的一个功能使控件保持可见。在我看来,CSS更像是一种解决方法。有没有一种方法可以在播放器启动前显示控件?很好的解决方案,只是为了提供一些信息,我使用了设置函数:videojs(“example_video_1”,{inactivityTimeout:0});