2016-07-27 1 views
1

재생 일시 중지 버튼은 HTML5 비디오와이 Video.JS에서 작동합니다. 다른 기능이 video.js에서 작동하지 않는 이유는 모르겠지만 HTML5 비디오에서 작동합니까?어떻게 Video.JS를 앞뒤로 15 초 건너 뛸 수 있습니까?

비디오 JS가 앞으로 및 뒤로 15 초 건너 뛰도록하려면 어떻게해야합니까? 또한, 이상한 이유로 동영상의 크기가 변경되지 않습니다.

<div id="instructions"> 
     <video id="my_video_1" class="video-js vjs-default-skin" width="640px" height="267px" 
      controls preload="none" poster='http://video-js.zencoder.com/oceans-clip.jpg' 
      data-setup='{ "aspectRatio":"640:267", "playbackRates": [1, 1.5, 2] }'> 
     <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> 
     <button onclick="playPause()">Play/Pause</button> 
     <button onclick="makeBig()">Big</button> 
     <button onclick="makeSmall()">Small</button> 
     <button onclick="makeNormal()">Normal</button> 
     <button onclick="restart();">Restart</button> 
     <button onclick="skip(-10)">Rewind</button> 
     <button onclick="skip(10)">Fastforward</button> 
    </div> 

    <script> 
    //controls for video.js HTML5 video player 
    var myVideo = document.getElementById("my_video_1"); 

    function playPause() { 
     if (myVideo.paused) 
      myVideo.play(); 
     else 
      myVideo.pause(); 
    } 

    function makeBig() { 
     myVideo.width = 560; 
    } 

    function makeSmall() { 
     myVideo.width = 320; 
    } 

    function makeNormal() { 
     myVideo.width = 420; 
    } 

    function skip(value) { 
      var video = document.getElementById("my_video_1"); 
      video.currentTime += value; 
    }  

    function restart() { 
      var video = document.getElementById("my_video_1"); 
      video.currentTime = 0; 
     } 

    </script> 
+0

'html','js'는 예상 결과를 반환합니까? – guest271314

+0

http://codepen.io/soljohnston777/pen/rLKjvQ 여기에 시도했지만 이동하지 않습니다 ... 내 로컬 서버에서 만든 play/pause가 작동하지만 video.js의 css 템플릿을 제외하고는 아무 것도 작동하지 않습니다. 버튼이 –

+0

일반적으로이 작업을 수행하는 video.js 방법은 무엇입니까? –

답변

2

는 조금 늦게하지만 난 이런 식으로 currentTime을을 사용이 도움이 될 것입니다

var video = videojs($("#player_id")); 
video.currentTime(video.currentTime() + 10); 

희망.

관련 문제