CodesJava

Easy learning with example program codes

Audio HTML

HTML <audio> Tag

To specify sounds (music and other audio clips), the HTML <audio> tag is used. Three types of file format are supported for HTML 5 audio tag currently. These are mp3, wav and ogg. Both the <video> and <audio> controls are supported in HTML 5. To play the multimedia items, technologies like Flash, Silverlight and other similar technologies are used.

Supported audio file format:

Browsermp3wavogg
Internet ExplorerYesNoNo
ChromeYesYesYes
FirefoxYesYesYes
OperaNoYesYes
SafariYesYesNo

Example 1:

<!DOCTYPE html>
<html>
<body>
<p>Play the Audio.</p>
<audio controls>
<source src="peacock.mp3" type="audio/mpeg">
This browser does not support the audio element.
</audio>
</body>
</html>

Output:

Explanation:

In the above example, we are playing an mp3 file using HTML audio tag.

Example 2:

<!DOCTYPE html>
<html>
<body>
<p>Play the Audio.</p>
<audio controls>
<source src="peacock.ogg" type="audio/ogg">
This browser does not support the audio element.
</audio>
</body>
</html>

Output:

Explanation:

In the above example, we are playing an ogg file using HTML audio tag.

Supporting Browsers:

Chrome, IE, Firefox, Opera and Safari.

Attributes of HTML <audio> Tag:

AttributeUses
controlsUsed to specify the audio controls and is displayed with play/pause buttons.
autoplayUsed to specify that the audio is on autoplay mode.
loopUsed to start the audio file over and over again, every time when it is completed.
mutedUsed to mute the audio output.
preloadUsed to specify the author view to load the audio file when the page loads.
srcUsed to specify the URL of the audio file to add.

 

Example 3:

<!DOCTYPE html>
<html>
<body>
<p>Play the Audio.</p>
<audio controls autoplay loop>
<source src="peacock.mp3" type="audio/mpeg">
This browser does not support the audio element.
</audio>
</body>
</html>

Output:

Explanation:

In the above example, we are playing an mp3 file using controls, autoplay, loop and src attributes of HTML audio tag.

MIME types for HTML <audio> tag:

Audio FormatMIME Type
mp3audio/mpeg
oggaudio/ogg
wavaudio/wav
Please follow and like us:
error
Posted in HTML   









Copyright © 2019 CodesJava DMCA.com Protection Status