Search code examples
htmlhtml5-video

In HTML5 Video , how to play a small clip from a long video?


I would like to show a small clip from a long video file that is over 10 minutes long. This segment of video would start at time offset /seek time of 90 seconds and would have a duration of 45 seconds . How can I do that ?


Solution

  • Phillip Brown is right. you can solve this by controlling yout html-player via js. for example in this case, the video would autostart and will play the videofile should 00:10min to 00:40min

    <video id="yourVideoplayer" width="640" height="480" preload="auto"> //preload="auto" buffers the video if initialize. you cannot seek a video which isn t buffering already
      <source src="test.mp4" type="video/mp4" />
      <source src="test.ogv" type="video/ogg" /> 
      This browser is not compatible with HTML 5
    </video>
    
    <script type="text/javascript">
       window.onload = playVideoTeaserFrom(10,40);   //this event will call the function after page was loaded
    
       function playVideoTeaserFrom (startTime, endTime) {
           var videoplayer = document.getElementById("yourVideoplayer");  //get your videoplayer
    
           videoplayer.currentTime = starttime; //not sure if player seeks to seconds or milliseconds
           videoplayer.play();
    
           //call function to stop player after given intervall
           var stopVideoAfter = (endTime - startTime) * 1000;  //* 1000, because Timer is in ms
           setTimeout(function(){
               videoplayer.stop();
           }, stopVideoAfter);
    
       }
     </script>
    

    there might be some bugs in it, but i guess you ll get the point