Including audio or video tag on the modern web browsers
made easier to display audio, video than ever before and opens some
amazing new possibilities.
<audio> Tag
<audio> is new to html and fortunately it is easy to code. Now
we can embed our audio music to html page without using any player or
flash object. Now date any browser which is based on WebKit, ex. Chrome,
Safari, Mozilla etc supports the use of regular mp3, Wav and ogg format
audio files.
Here is the example to use <audio> in HTML file
<audio loop=”loop” autoplay=”autoplay” controls=”controls”>
<source src=”mymusic.ogg” type=”audio/ogg”>
<source src=”himesh.mp3″ type=”audio/mpeg”>
</audio>
Attributes of <audio> tag
- autoplay : Value can be “Auto” or “None”.
- Controls : Value can be “Controls’, Which denotes that default audio controls such as Play/Pause/Stop should be displayed
- Loop : value can be “loop”, Which denotes that will audio starts over again on every time when finished.
- muted : value “muted”, Laod audio with muted output
- src : Value “Url”, Url for sourch audio file.
<video> Tag
using <video> is same as using <audio> tag. Here is the simple example of the video tag
<video src=”myvideo.webm” controls=”controls”>
</video>
This is the simple and default tag for embedding video in html5.
Specifying multiple sources
By using <source> elements, Inside the Video tag. source
elements enables you to specify more than one video file format. It is
helpful if any browser doesn’t supports one of the video specified. Here
is the example…
<video controls=”controls”>
<source src=”my-video.webm” type=’video/webm;codecs=”vp8, vorbis”‘/>
<source src=”my-video.mp4″ type=’video/mp4;codecs=”avc1.42E01E, mp4a.40.2″‘/>
</video>
Default Attributes for the video tag is same as audio tag.