Play audio in HTML 5
I'm trying to develop a way to play audio in HTML 5.
I was under the impression it did it as a part of HTML 5.
The attached code does not work; I think it will be clear what I am attempting.
What I need is the ability to click a button on a page & when the button is clicked, play the audio file. I do NOT want controls; no visible player on the page.
NO Flash; I need this to work in the iPad / iPhone environment.
I was under the impression it did it as a part of HTML 5.
The attached code does not work; I think it will be clear what I am attempting.
What I need is the ability to click a button on a page & when the button is clicked, play the audio file. I do NOT want controls; no visible player on the page.
NO Flash; I need this to work in the iPad / iPhone environment.
ASKER CERTIFIED SOLUTION
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
ASKER
Works perfectly (in IE). Will it work in FireFox or do I need an ogg file? Or is that video only?
Glad it worked out for you :)
Yes, it will work in FireFox as well, but you'll need either an .ogg or .wav...which in HTML5 is easy to implement, just add an additional fallback audio source and to change a few things around:
Yes, it will work in FireFox as well, but you'll need either an .ogg or .wav...which in HTML5 is easy to implement, just add an additional fallback audio source and to change a few things around:
<audio id="player">
<source src="audio.mp3" type="audio/mpeg">
<source src="audio.ogg" type="audio/ogg">
</audio>
<div>
<button onclick="document.getElementById('player').play()">Play</button>
</div>ASKER
Will it also work in Safari & Chrome?
Absolutely :)...just make sure you use the correct default audio file for the browser you are wanting to use...so if another browser supports a different audio file, just add another line to the audio tags, like I've done in the last source code post I made :)
Here's a quick list for you:
Desktop Browser Version Codec Support
Internet Explorer 9.0+ MP3, AAC
Chrome 6.0+ Ogg Vorbis, MP3, WAV†
Firefox 3.6+ Ogg Vorbis, WAV
Safari 5.0+ MP3, AAC, WAV
Opera 10.0+ Ogg Vorbis, WAV
Mobile Browser Version Codec Support
Opera Mobile 11.0+ Device-dependent
Android 2.3+ Device-dependent
Mobile Safari* iOS 3.0+ MP3, AAC
Blackberry 6.0+ MP3, AAC
*(iPhone, iPad, iPod Touch)
You can also look at this URL for more browser specific codec support:
http://html5doctor.com/html5-audio-the-state-of-play/
Desktop Browser Version Codec Support
Internet Explorer 9.0+ MP3, AAC
Chrome 6.0+ Ogg Vorbis, MP3, WAV†
Firefox 3.6+ Ogg Vorbis, WAV
Safari 5.0+ MP3, AAC, WAV
Opera 10.0+ Ogg Vorbis, WAV
Mobile Browser Version Codec Support
Opera Mobile 11.0+ Device-dependent
Android 2.3+ Device-dependent
Mobile Safari* iOS 3.0+ MP3, AAC
Blackberry 6.0+ MP3, AAC
*(iPhone, iPad, iPod Touch)
You can also look at this URL for more browser specific codec support:
http://html5doctor.com/html5-audio-the-state-of-play/
In the meantime, the iPad/iPhone can typically only play MP3 and AAC files...just make sure that you include it in the <audio> tags like so:
Open in new window