HTML5 Series – Video

Like Audio embedding Video in an HTML5 web page is really simple to do and has a very similar syntax.

The video tag can contain multiple source tags to specify videos in different formats as not all browsers support the same ones, and some text to be displayed if the browser does not support any. The video tag can also have a controls element specified to instruct the browser to display controls for the playback.

<video controls>
    <source src="URL of video.mp4" type="video/mp4">
    <source src="URL of alternate video.ogg" type="video/ogg">
    Your browser doesn't support viodes
</video>

You can also set the following tags:

autoplay Specifies that the video should begin playback immediately
loop Sets the video to repeat
muted Mutes the audio on playback
poster Specifies an image to be shown what the video is downloading
preload Specifies if an how the video should be loaded when the page loads

It is also possible to control a videos playback through JavaScript. You can reload the element, play and pause that track.

var v = document.getElementById("myVideo");
v.play();
v.pause();
v.load();
Advertisements

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s