Issue with HTML5 audio control in Visual Studio 2010 and ASP.NET MVC

I am trying to add HTML5 audio control to my page. Here's the code:

<audio src="../../Content/BattleNet_MusicLoop.ogg" 
controls="controls" autoplay="autoplay" loop="loop">
Your browser does not support the new HTML5 audio element.
</audio>

When I click debug, I can see the audio player for about a second and then it turns dark gret with light "x" icon in the middle开发者_高级运维. I clicked on "Copy Audio Source" and the source seems to be correct. Browser is not the issue because it's a Firefox 4.0 Beta 1. It plays this exact HTML5 audio player fine on http://www.w3schools.com/html5/tag_audio.asp. That's where I got it from by the way.

I am using Visual Studio 2010 HTML5 add-in by Mikhail Arkhipov. My project is based on ASP.NET MVC 2 and .NET Framework 3.5

Any ideas what could be causing this issue?

You have to upload the song to a server, for some reason firefox can't play the song if it's on the localhost, try to upload the file to some host like toofiles and get the url and use it as src

example:

<audio autoplay="autoplay" controls="controls" >
        <source src="http://dl.toofiles.com/vaaoje/audios/rooster.ogg" type="audio/ogg" />
        <source src="http://dl.toofiles.com/vaaoje/audios/rooster.mp3" type="audio/mpeg"/>
</audio>

the ogg file is for firefox and the mp3 file for chrome and IE.

Did you try to replace "../../Content/BattleNet_MusicLoop.ogg" with '<%= Url.Content("~/Content/BattleNet_MusicLoop.ogg") %>' ?

Try it in chrome, it should work. I had the very same issue with firefox.

what DTD your page declares?