cancel
Showing results for 
Search instead for 
Did you mean: 

HTML 5 <audio> tag not working in FF

Highlighted
New Contributor

HTML 5 <audio> tag not working in FF

I am developing a website in asp.net and html 5 and trying to add some audio to the site.

My site is:

http://www.kevinroseworld.com/music.aspx/

It is, currently, a very simple set up, just the one song. It works fine in Chrome and Safari, IE does not support the Audio tag and the message appears where it is supposed to, however, Firefox does not display the error message or play the audio file.

I started using FF 3.6.10 and have now upgraded to FF 4 Beta 6 and neither version works.

Any advice as to how to fix this?

I also had a look on other forums and found others with the same problem: http://www.manifestmusicproductions.com/soundsNonflash.php for example, works in Chrome/Safari but not in FF.

16 REPLIES
Site Moderator

Re: HTML 5 <audio> tag not working in FF

You can't play MP3 files with such a code in Firefox.
See https://developer.mozilla.org/En/Media_formats_supported_by_the_audio_and_video_elements

<audio controls="controls"> 
	<source src="http://www.kevinroseworld.com/Music/OkaVanga/OkaVanga/BajeLaCalle.mp3" type="audio/mpeg" />
    Your browser does not support the audio element.
</audio>

You will have to use a normal object element to play that song in Firefox.
You can look these as an example:

<object data="music.mp3" type="application/x-mplayer2" width="xxx" height="xxx"><param name="filename" value="music.mp3"></object>
<embed type="application/x-mplayer2" src="file.mp3" height="xxx" width="xxx" >
New Contributor

Re: HTML 5 <audio> tag not working in FF

Thank you for your reply.

Looking at that link and doing a bit more research led me to https://developer.mozilla.org/En/Using_audio_and_video_in_Firefox.

Both of these help pages say that .ogg files are supported in Firefox. However I added the audio in .ogg format and my code still does not work.

<audio controls="controls"> 
        <source src="http://www.kevinroseworld.com/Music/OkaVanga/OkaVanga/BajeLaCalle.ogg" type="audio/ogg" />
	<source src="http://www.kevinroseworld.com/Music/OkaVanga/OkaVanga/BajeLaCalle.mp3" type="audio/mpeg" />
    Your browser does not support the audio element.
</audio>

Is the <audio> tag simply not supported by firefox (yet)? I can ofc use a flash plug in (or JS or whatever) to work around this (as I will need to do for IE anyway) but would much prefer this to work in Firefox without this need.

New Contributor

Re: HTML 5 <audio> tag not working in FF

You likely already figured this out, but <audio src="http://www.kevinroseworld.com/Music/OkaVanga/OkaVanga/BajeLaCalle.ogg" controls="controls"></audio> works just fine in FF3.6.

New Contributor

Re: HTML 5 <audio> tag not working in FF

Hello and thank you for your reply.

Yes the site is now working in all HTML 5 supporting browsers including FF.

My problem was not a coding one as it happens, but I had missed out some essential information on the ogg file itself. Fortunately I have now solver the problem.

Thank you again

New Contributor

Re: HTML 5 <audio> tag not working in FF

you said you solved the problem by correcting some essential information in the ogg file itself? could you explain please? I seem to have problems playing any ogg file I make or convert, but theres ogg files online that play just fine. I'd really like to know what solution you found please.

New Contributor

Re: HTML 5 <audio> tag not working in FF

Hello

Yes, the problem was that I missed out a MIME type on the OGG files.

Hope this helps you.

New Contributor

Re: HTML 5 <audio> tag not working in FF

Hi,

I'm having the same problem. I'm using .ogg file but still won't play. What do you mean you missed out the MIME type?

I'm using this <audio src="http://kmwithcath.supreme-solutions.co.uk/media/uploads/Ilovemyfamily.ogg" controls="controls" autoplay="autoplay"> Your browser does not support the audio element. Please use Firefox, Chrome or Safari to view this site. </audio> Which won't play in my FF but does in Chrome and Safari.

New Contributor

Re: HTML 5 <audio> tag not working in FF

I'm now using this

<audio  controls="controls" autoplay="autoplay" >
	<source src="http://kmwithcath.supreme-solutions.co.uk/media/uploads/Ilovemyfamily.ogg" type="audio/ogg" tabindex="0" />
	Your browser does not support the audio element. Please use Firefox, Chrome or Safari to view this site.
</audio>


But still it doesn't play in FF. I'm using FF 3.6.13

New Contributor

Re: HTML 5 <audio> tag not working in FF

The responce I got from my website hosts is this...

IME type was missing for the .ogg files and I have fixed that now. As you can see the http://www.kevinroseworld.com/Music.aspx is now working properly.

My code is still the same as before...

<p>San Rora</p>
<audio controls="controls"> 
   <source src="http://www.kevinroseworld.com/Music/OkaVanga/OkaVanga/SanRora.ogg" type="audio/ogg" />
   <source src="http://www.kevinroseworld.com/Music/OkaVanga/OkaVanga/SanRora.mp3" type="audio/mpeg" />
    Your browser does not support the audio element.
</audio>


Unfortunately I am not an expert on ogg files so am not 100% sure what needs to be done. However, http://wiki.xiph.org/MIME_Types_and_File_Extensions looks like a really good site.