HTML5 Tutorial – Captioning video tracks

imageThe <track> element represents a timed text file to provide users with multiple languages or commentary for videos. You can use multiple tracks and set one as default to be used when the video starts.

You can provide a transcript of the video.

This article introduces how can use WebVTT (Web Video Text Tracks) and Media Multiple Text Tracks API as part of your video.

Continue reading “HTML5 Tutorial – Captioning video tracks”

HTML5 Tutorial – Custom Controls for Multimedia

imageWhen you display video in HTML5, you have may want to display a set of controls to the user. The HTML5 video tag has a control attribute that lets you display the controls that come with the browser.

But you may want to build custom controls using its media API, and the media events. Play, pause, and seek in the entire video, change the volume, mute, change the playback rate (including going into negative values).

This post shows how you can build a custom media player using different the media API attributes, events, and methods.

Continue reading “HTML5 Tutorial – Custom Controls for Multimedia”

HTML5 Tutorial – Video, Audio Multimedia

imageHTML5 defines a new element which specifies a standard way to embed a video/movie on a web page: the <video> element.

Internet Explorer 9+, Firefox, Opera, Chrome, and Safari support the video element, but you may need multiple files to support the video formats.

For this demo, I’m using a video that is in the public domain, Popeye for President.

Continue reading “HTML5 Tutorial – Video, Audio Multimedia”