Quantcast
Channel: BinaryTides » Html5
Viewing all articles
Browse latest Browse all 10

Add custom functions to the html5 audio element for better functionality

$
0
0
Html5 Audio
The html5 audio element provides a simple api to play sound files like mp3, ogg, wav etc. It can be created by putting an audio tag in the html or by creating an instance of the Audio object in javascript. Here is a quick example of using it from within javascript code.

var aud = new Audio();
aud.src = 'path/to/song.ogg';

aud.play();

That much of code would load the file specified in the src path and play it. There are additional functions and properties that can be used to pause, change volume etc.
The Hacks
1. Stop Function
The Audio element does not come with a stop function. However its easy to give it one like this.

//Give the Audio function a stop function
HTMLAudioElement.prototype.stop = function()
{
this.pause();
this.currentTime = 0.0;
}

The above will add a stop function to audio elements. It first pauses and then resets the time to 0.0

var aud = new Audio();
aud.src = 'background.ogg';
aud.play();

//stop it
aud.stop();

2. Check if audio is playing or not
The ispaused attribute can be used to check if the audio element is currently playing or not. Here is how

//Function to check if audio is playing or not
HTMLAudioElement.prototype.is_playing = function()
{
return !audelem.paused;
}
Now call the is_playing function on any audio element to check if its playing or not.
3. Correct pause...

Read full post here
Add custom functions to the html5 audio element for better functionality


Viewing all articles
Browse latest Browse all 10

Trending Articles