4

I am trying to put some music on my website, so I have decided to use the HTML5 balise, . I learned that I must use .mp3 + .ogg if I want the player works on most of the browsers. So I made this :

<audio controls="">
 <source src="http://maxinthebox.fr/files/167d9a8aaf49fbf1bc226045c8f6920e.ogg"/>
 <source src="http://maxinthebox.fr/files/3d4fafe76fbbfd5cba1b5ec181a35b94.mp3"/>
</audio>

It works perfectly with Chrome or Safari, even if I put only the .ogg or the .mp3 either. But with Firefox, no way! I have tried to open only the .ogg, but Firefox shows me a video player. I have searched the web, but I haven't found any solution which works.

So if you can help me to resolve my problem, it would be great !

Thank you in advance !

EDIT: The problem was not from Firefox, not from the .ogg file but from me ! I had a .aif file that I re-encoded with VLC in order to make a .ogg file. And when it asks me if I want to transcode the audio, I checked MP3 instead of Vorbis ! But with your help, I realized my mistake ! Thank you a lot !

Tiwenty
  • 733
  • 1
  • 10
  • 17

1 Answers1

1

Try specifying the type attribute:

<source src="http://maxinthebox.fr/files/167d9a8aaf49fbf1bc226045c8f6920e.ogg" type="audio/ogg"/>

Else, it is a mime-type issue, with your web-host, causing the video player to open instead. See this answer.

EDIT: The ogg file itself may not be compatible with firefox. Check with some of the samples here, to identify if it is a server-issue or an ogg-file issue.

https://developer.mozilla.org/En/Media_formats_supported_by_the_audio_and_video_elements

Community
  • 1
  • 1
Anirudh Ramanathan
  • 46,179
  • 22
  • 132
  • 191
  • It the HTML page, it shows me the player, but when I click on the play button, it doesn't work and I must restart Firefox to make the domain re-works. But when I open it directly, it says that the file is corrupted. EDIT : And I put the 3 lines in my .htaccess – Tiwenty Jul 29 '12 at 08:30
  • Sorry ? I didn't understand your answer :/ – Tiwenty Jul 29 '12 at 08:35
  • Your mime-type seems correct. Still doesn't work in firefox. Let me check once again. – Anirudh Ramanathan Jul 29 '12 at 08:42
  • 1
    The only difference I find between the HTTP responses from your code and an OGG that works is the placement of HTTP response headers, which shouldn't matter. Try changing your OGG file to the above file, and check. [**link to ogg**](http://www.kevinroseworld.com/Music/OkaVanga/OkaVanga/BajeLaCalle.ogg) – Anirudh Ramanathan Jul 29 '12 at 08:51
  • 1
    Thank you, I have found my mistake. See the first post ;) – Tiwenty Jul 29 '12 at 09:27