크롬이 자신의 타임 라인을 videojs 플레이어에 추가합니다.

반응 애플리케이션에서 videojs를 사용하려고합니다. 반응이 좋았지 만 문제는 크롬이 owm 타임 라인 (컨트롤 막대)을 플레이어에 추가한다는 것입니다. 기본 videojs 컨트롤 막대를보고 싶습니다. 여기에 플레이어의 코드와 jsfiddle은크롬이 자신의 타임 라인을 videojs 플레이어에 추가합니다.

<div class="main"> 
    <div class="video-container"> 
    <div class="video-wrapper"> 
<video controls> 
    <source src="http://www.w3schools.com/html/mov_bbb.mp4" type="video/mp4"> 
    <source src="http://www.w3schools.com/html/mov_bbb.ogg" type="video/ogg"> 
    Your browser does not support HTML5 video. 
</video> 
</div> 
    </div> 
    <div class="section"> 

    </div> 

</div>

CSS 나는이 문제를 해결하려면 어떻게

.main { 
    height: 500px; 
    width: 100%; 
    display: flex; 
} 

.video-container{ 
    background: red; 
    flex: 2; 
    display: flex; 
    align-items: center; 
} 

.section { 
    background: blue; 
    flex: 1; 
} 

.video-wrapper { 
    position: relative; 
    padding-bottom: 56.25%; /* 16:9 */ 
    padding-top: 25px; 
    height: 0; 
    flex: 1; 
} 

.video-wrapper > video { 
    position: absolute; 
    top: 0; 
    left: 0; 
    width: 100%; 
    height: 100%; 
}

https://jsfiddle.net/t1gsrsu5/2/

입니까? 비디오 태그에

출처

2017-02-12 ApurvG

: 공식적으로 어디서나 문서화 아니에요

<style> .video-js .vjs-current-time { display: block; } .video-js .vjs-time-divider { display: block; } .video-js .vjs-duration { display: block; } .video-js .vjs-remaining-time { display: none; } </style>

... 난에 걸림돌 후, 그것을 알아 냈어 동영상 태그에서 'controls' 속성을 삭제하십시오. https://developer.mozilla.org/en/docs/Web/HTML/Element/video#attr-controls – Giladd

('controls'속성은 괜찮습니다.)하지만 두 번째 비디오 태그 예제에 나와있는 것처럼 클래스 속성과 데이터 설정 속성이 필요합니다. http://docs.videojs.com/docs/guides/setup .html – Dave

, '아이디'와 '수업'에 대한 속성을 추가, 그래서 다음과 같습니다

<video id="videoID" class="video-js vjs-default-skin" controls> 
</video>

[참조 : http://docs.videojs.com/docs/guides/setup.html] 비디오 태그 아래

, 하나를 추가 이 같은 자바 스크립트의 라인 : 기본 '큰 화살표'를 클릭하면

이

<script type="text/javascript" > 
    var myPlayer = videojs('videoID'); 
</script>

[자동 사라지고 컨트롤 막대 videojs이 나타납니다. ]

나에게 맞지 않는 경우 'negative-hour'가 마음에 들지 않는다면 CSS 코드를 추가 할 수 있습니다. 코드)를 숨기고 은 더-일반적으로 사용되는 "시간/기간"정보를 숨기기를 취소하려면 : https://github.com/videojs/video.js/issues/2507

출처

2017-02-12 20:42:40 Dave

크롬이 자신의 타임 라인을 videojs 플레이어에 추가합니다.

답변

관련 문제