html5 video currentFrame playback

neutrino83 · 05-25-2012, 09:50 PM

Hi!

What I need is pretty simple:

When user clicks on a button, seek to a specific frame in html5 video and keep playing from there.

But my code here doesn't work. Instead of continuing playback from the new time (currentFrame) it will start from the beginning. How can I jump to a frame in my video and keep playing forward from there?

Here is my feeble attempt:

Code:

<div id="buttons">
<img class="choice01" src="btn_piano.jpg" onclick="jumpToTime();"/>
</div><!-- end buttons -->

<video id="videoclip"> <source src="video/testi.mp4"> your browser does not support the video tag</video>

Code:

function jumpToTime(){
   document.getElementById("videoclip").currentTime = 160;
   document.getElementById("videoclip").play();
};

FutureWebDev · 05-25-2012, 10:15 PM

How about trying this. Not sure if it will work.

Code:

function jumpToTime(){
   document.getElementById("videoclip").currentTime = 160;
   document.getElementById("videoclip").currentTime;
};

So what your doing is setting the currentTime property to 160. Then your returning the currentTime property to the video element.

Actually you may not even need the second line. So if the above doesn't work, try deleting the second line.

neutrino83 · 05-26-2012, 06:32 AM

The problem with that is that the playback gets stopped. And if I try to continue playback with

Code:

function jumpToTime(){
   document.getElementById("videoclip").currentTime = 160;
   document.getElementById("videoclip").currentTime;
   document.getElementById("videoclip").play();
};

then the playback always jumps to the beginning of the video..