Working with Audio - HTML5 Canvas

HTML and CSS Reference

In-Depth Information

ended

true or false . Set when an audio object has played through its entire duration .

currentSrc

URL to the source file for the audio object.

preload

Specifies whether the media file should be loaded before the page is displayed. At

the time of this writing, this property has not been implemented across all browsers.

To see which properties and events of the HTMLMediaObject are suppor-

ted in which browsers, visit http://www.w3.org/2010/05/video/mediae

vents.html .

Important Audio Events

Many events are defined for the HTML5 audio element. We are going to focus on the

following events because they have proven to work when building audio applications:

progress

Raised when the browser is retrieving data while loading the file. (This still has

spotty support in browsers, so be careful with it.)

canplaythrough

Raised when the browser calculates that the media element could be played from

beginning to end if started immediately.

playing

Set to true when the audio is being played.

volumechange

Set when either the volume property or the muted property changes.

ended

Set when playback reaches the duration of the audio file and the file stops being

played.

Loading and Playing the Audio

We are going to use the canplaythrough and progress events to load <audio> before we

try to play it. Here is how we embed the audio for song1 :

Your browser does not support the audio element.

</audio>

Search WWH ::

Custom Search

Home