javascript - HTML5 reset video and play again

Question

I'm using timesheets.js and want to play a HTML5 video when the slider is active. I'm using this code:

if (document.getElementById("v_"+element.id))
{
video = document.getElementById('v_'+element.id)
video.currentTime = 0;
video.play();
}

If I'm not using "video.currentTime = 0; it works most of the time (except when videos are too long). I have to reset the video so it plays from the beginning. Now it resets the video, but it doesn't play. Any ideas?

Answer 1

While Stichy posted a sufficient answer to his own question, the method video.load() causes unnecessary bandwidth to be used as it reloads the video from the server.

Loading videos in particular can pose a heavy load on the server. Consider you could possibly be loading many megabytes each time the video is replayed.

There is also a short period where the user needs to wait for the video to re-download as well.

The solution I have found that works most efficient and smooth is by simply pausing the video before changing the currenttime property.

Like so:

video.pause();
video.currentTime = 0;
video.play();