Detailed use of audio in HTML5

HTML5 's audio function has been very powerful, playback, jump, buffer, etc. can only be achieved by flash before the function, HTML5 audio can be easily done

A recent project to use this feature, I use the situation to write down for your reference, because I need the function is very simple, so do not complex, if you want to use more features, you can refer to the following API, can achieve a lot of high function

Audio-related APIs

<audio src= "Address of Audio" > alternate (what is displayed when the browser does not support audio) </audio>

function Description of control function

• Load () Loads audio, video software that is not normally called unless it is a dynamically generated element that is used to preload before playing
• Play () loads and plays audio, video files unless the file is paused in another location, the default starts playing again
• Pause () pauses the audio, video files that are in the playback state

Audio's read-only media features are:

read-only property description

• duration    gets the length of time the media file was played, in S, If not available, Nan
• paused      Returns true if the media file is paused, otherwise false
• ended         returns True if the media file has finished playing
• error            error code returned after an error
• currentsrc   Returns a file that is being played or loaded as a string, corresponding to the file selected by the browser in the source element

Audio can be scripted to control the attribute values:

• AutoPlay automatically plays media files that have already been loaded, or if the query is set to AutoPlay
• Loop to set the media file to loop, or whether the query is set to loop
• CurrentTime returns the time it takes to play from start to current, or set the value of CurrentTime to jump to a specific location, in s units
• Controls show or hide user control interface
• Volume set the volume value between 0.0 and 1.0, or query the current volume value
• Muted setting is muted
• Autobuffer If the media file is buffered before playback, and if AutoPlay is set, this attribute is ignored

For these properties, the mainstream browser is supported. But don't think there's no compatibility, in the audio stream, there are two camps. Firefox and Opera support Ogg audio, Safari and IE support MP3. Fortunately Google Chrome is supported.

<div id= "Audiocontrol" ><div class= "Play" ><span id= "Play" >play</span></div></div ><audio id= "Media" src= "Test.mp3" ></audio>

var media = $ (' #media ') [0];var Audiotimer = null;//bind play Pause control $ ('. Play '). Bind (' click ', Function () {    playaudio ();});// Play Pause Toggle Function Playaudio () {    if (media.paused) {        play ();    } else {        pause ()    }} Play function play () {    media.play ();    $ (' #play '). html (' Pause ');} Pause function Pause () {    media.pause ();    $ (' #play '). html (' Play ');}

Detailed use of audio in HTML5