VideoJS: kontrolleri görünür durumda tut

Question

VideoJS'yi seviyorum ama kontrol çubuğunu her zaman görünür halde tutmanın bir yolunu bulamıyor (çalarken sönme yok). Bu konuda bilgiler aramış ve danışma işlevi böyle gizlemek geçersiz kılmak için a topic about it, bulunan:

/geçersiz kılma kontrolleri autohide/

gizlemeye = function() {fn/* hiçbir şey değil */ }; Burada çalışmak olmadığından

Ama bu eski olabilir. (Sürüm 3.2.0)

Bunu nasıl başarabileceğimi bilen biri var mı?

Çok teşekkürler!

Answer 1

Video-js.css içindeki .vjs-fade-out ve .vjs-default-skin .vjs-controls sınıflarından visibility:hidden ve opacity:0 kurallarını yorumlayın/kaldırın.

.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*/ 
} 

Answer 2

Teşekkürler!

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

Teşekkür: Ben orijinal dosyayı kesmek için kaçınmak istedim ben , başka bir çözüm buldum, bu ekleme Benim CSS!

Answer 3

Bu sorunun birkaç yıldır olduğunu biliyorum, ancak bunu yapmam gerekiyor ve yukarıdaki cevaplar videoların üstündeki kontrolleri tutuyor. Video oynamaya başladıktan sonra kontrolleri görünür tutmak ve videonun altında tutmak için videoJS stillerini geçersiz kılmak için kendi CSS dosyasımda aşağıdaki CSS'yi kullandım. Burada ölüçağırıcılık

.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; 
} 

Answer 4

Sadece bir tane daha biraz ...

Peter Kitts son cevap gayet çalışsa da, başka bir seçenek tamamen hareketsizlik zaman aşımı devre dışı bırakır inactivityTimeout için 0, ayarlamaktır.

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

 
<video id="my_video_1" class="video-js vjs-default-skin" controls preload="auto" width="640" height="268" 
 
    data-setup='{ "inactivityTimeout": 0 }'> 
 
    <source src="http://vjs.zencdn.net/v/oceans.mp4" type='video/mp4'> 
 
    <source src="http://vjs.zencdn.net/v/oceans.webm" type='video/webm'> 
 
</video>