codescracker


html

HTML Multimedia Tags



« Previous Tutorial Next Tutorial »


HTML5 has introduced two new multimedia tags, AUDIO and VIDEO, for displaying the audio and video streams on a Web page.

You can play the multimedia files, which are stored in your local computer, on the Web page by specifying their location. The src attribute is used to specify the multimedia file to play it on the Web page.

If the Web browser does not support AUDIO and VIDEO tags, then the text defined between the starting and the closing tags of these tags are displayed on the Web page.

Attributes of AUDIO Tag

The AUDIO tag of HTML5 supports only three audio file formats i.e. .oog, .mp3, .wav

Following table shows the attributes of the AUDIO tag

Attribute Description
autoplay Plays the audio file as soon as the Web page loads
controls Displays the controls on the Web page, such as play and pause buttons
loop Replays the audio file
preload Specifies whether the audio file is preloaded on the Web page or not
src Provides the location of the audio file to play

Attributes of VIDEO Tag

You can use the VIDEO tag to display a video file on the Web page. The VIDEO tag supports the .gov and .mp4 file formats.

Following table describes attributes of the VIDEO tag

Attribute Description
audio Controls the default state of the video's audio channel
autoplay Plays the audio file as soon as the Web page loads
controls Displays the controls on a Web page, such as play and pause buttons
height Specifies the height of the VIDEO tag
loop Replays the video file
preload Specifies whether the video file is preloaded on the Web page or not
poster Provides an image to be displayed when the video file is not available
src Provides the location of the video file to play
width Specifies the width of the VIDEO tag

You can also use the SOURCE tag within the opening and the closing tags of the VIDEO tag to provide the source of the video file.

The SOURCE tag is used in a situation when the location of the video file is not confirmed. In this case, the VIDEO tag plays the first video file located in the specified path. The following code snippet shows the use of the VIDEO tag :

<VIDEO src="video.ogv" autoplay="true" loop="3" controls>
</VIDEO>

In the above code snippet, we have defined a video.ogv file in the src attribute. We have also set the autoplay attribute to true, which implies that the video file start playing as soon as the Web page loads. the loop attribute is set to 3, which implies that the video file will be played three times. In addition, the controls attribute displays the controls on the video player.


« Previous Tutorial Next Tutorial »



Tools
Calculator

Quick Links
Signup - Login - Give Online Test