Learn how to use HTML audio elements to embed sounds easily in a Web page. This tutorial contains a large number of code examples. As of now, audio playback in a Web browser has always been a bit of a black art. Traditionally, there are several ways to embed sound in Web pages-some work better than others, and many people only work if you happen to use the correct browser with the right plugin. the ubiquitous Flash plugin has largely helped because Flash can easily embed audio in a way that works with most browsers. However, this does not help the iphone and the ipad do not support flash browsers such as Safari. in short, this is a bit messy. Fortunately, HTML5 seems to make life easier for our developers because of its audio elements. This element allows you to embed audio files in a Web page and control the sound of playback using JavaScript. More importantly, it does not require any plug-ins to work and supports almost all modern web browsers. (We will come back to the browser support!) )In This tutorial, I'll show you how to embed sound into an audio element in a page. We also take a look at how to trigger and stop audio through JavaScript, and how to make sure that our audio can play many web browsers possible. HTML5 Audio ElementsBasic audio elements are very easy to use. As this is the season to be happy--and Europe over its fair share of snow--let us embed short MP3 fragments of flat Crosby "White Christmas"<audio src= "Whitechristmas.mp3" > </audio>//www.heatpress123.netThere is not much explanation that needs to be here! , just like the tab allows you to include an image file in a page,<audio> tag includes an audio file. Cross-browser support Although simple, in the example above, it will not work correctly in many browsers. This is the audio file format thermal transfer machine . Some browsers can play MP3 files without ogg files, while other browsers can play Ogg format files, but not. MP3. Most browsers can play WAV files, WAV files are decompressed, resulting in large file size, which is impractical for short audio fragments outside anything. The following is a brief description of the current browser support for multiple audio formats:
Browser |
。 MP3 |
。 OGG |
Of Wav |
Firefox 4 |
No |
Is |
Is |
Safari 5 's |
Is |
No |
Is |
of Chrome 8 |
Is |
Is |
Is |
Opera 11 |
No |
Is |
Is |
IE9 |
Is |
No |
Is |
What audio formats are supported by your browser. As you can see from the table, the only viable way to provide cross-browser support for audio playback services is to play MP3 files, and Ogg files to other. to do this, you can add multiple <source> elements to the <AUDIO> element to specify the same multi-format sound file. Then, the browser will play the first file that it can play. Here is an example:
<AUDIO> <source src= "Whitechristmas.mp3" > <source src= "Whitechristmas.ogg" ></audio>Of course, this does not mean that you need to create. MP3 and Ogg versions of sound files (such as Audacity's tools are handy), but it will give you good cross-browser support. Detailed Description: http://html5.662p.com/thread-10-1-1.html