HTML and CSS Reference
In-Depth Information
window.onload = function() {
...
// Pause playback when the user starts seeking.
seekBar.addEventListener(“mousedown", function(e) {
video.pause();
});
}
2. Create the other event listener that starts the video playing again when the user releases the mouse button
(the mouseup event).
window.onload = function() {
...
// Continue playback when the user stops seeking.
seekBar.addEventListener(“mouseup", function(e) {
video.play();
});
}
3. Save the video.js file.
That's it! You're all done with the Seek bar.
Open the About page and play around a bit with the Seek bar. You should see that the video pauses when you start to
drag the slider handle and then starts playing again when you release it. The frame displayed in the video still
changes as you drag the handle to show where you are moving to in the video. Figure 11-6 shows how your page
should look with the new Seek bar.
Search WWH ::




Custom Search