Audio
Audio Earlier there is no way to play audio files on a web page or you need plug-in like flash but now with HTML5 it is easy to play the audio.
The HTML5 <audio> element specifies a standard way to insert audio in a web page.
To play an audio file in HTML, use the <audio> element:
How HTML <Audio> element Works
The controls attribute adds audio controls, like play, pause, and volume.
Text between the <audio> and </audio> tags will display text on the browsers that do not support the <audio> element.
Multiple <source> elements can link to different audio files. The browser will use the first recognized format.
Different types of HTML Audio Media
File Format Media TypeMP3 audio/mpegOgg audio/oggWav audio/wavHTML Audio – Methods, Properties, and Events
HTML5 defines DOM methods, properties, and events for the <audio> element which allows users to load, play, and pause audios, as well as setting duration and volume.
Media Events
Events DescriptionOnplay This event is raised when the playback begins.Onpause This event is raised when the audio playback is paused.Onended This event is raised when the audio playback has ended or completed.Ontimeupdate This event is raised periodically as the audio playback is going on.ondurationchange This event is raised when the duration changes, starts after the media is loaded sufficiently for the playback to startonvolumechange This event is raised when the volume attribute is altered, or audio is muted and unmuted.HTML5 Audio Tags
Tag Description<audio> This Tag describes the sound content<source> This Tag describes the multiple media resources for media elements, such as <video> and <audio>Audio attributes
Attribute Descriptionsrc This attribute specifies the Source URL of audio.autoplay This attribute is used to automatically play the files as soon as it loads.controls This attribute controls sets the browser’s default audio controls.Loop This attribute tell the browser to play the audio in loop.muted This attribute is used when a user needs initially muted the audio.preload This attribute specifies the browser whether to load video in advance or not. There are three values which has to be specified:1. none: the function of this attribute is not to load until user starts playback
2. metadata: the function of this attribute is to Load audio’s metadata(e.g. length) before playback.
3. auto: the function of this attribute is to download the audio completely as soon as possible. This is default behaviour.