Why isn't my webm file playing in firefox?

Question

I'm using video.js, I've tried using ogv and now webm. Neither will play in Firefox 25. Site is http://www.hybi.info

<video id="intro" class="video-js vjs-default-skin" width="498" height="365" 
data-setup= '{"controls":true, "autoplay": true, "preload":"auto"}'>
<source src="/images/intro.mp4" type="video/mp4">
<source src="/images/intro.webm" type="video/webm">
<source src="/images/intro.ogv" type="video/ogg">
</video>

Prior to using video.js I got

Video format or MIME type is not supported. 

Works fine in Chrome. What's the deal?

Answer 1

SOLVED: The issue here was actually the hosting account - godaddy.

Godaddy does not by default serve .webm or .ogv/ogg and using .httaccess doesn't do anything. You instead need to create a web.config file and add in this code:

<configuration>
   <system.webServer>
   <staticContent>
     <mimeMap fileExtension=".EXTENSION" mimeType="TYPE/SUBTYPE" />
   </staticContent>
 </system.webServer>
</configuration>

for example I added:

<configuration>
 <system.webServer>
   <staticContent>
     <mimeMap fileExtension=".ogv" mimeType="video/ogg" />
     <mimeMap fileExtension=".webm" mimeType="video/webm" />
   </staticContent>
 </system.webServer>
</configuration>

source: http://support.godaddy.com/help/article/6286/modifying-or-adding-custom-mime-types-to-windows-hosting-accounts

Answer 2

According to the HTML of your page, once the page loads on Firefox, the video element has src="/images/intro.webm". However, once I tried to visit that page, it returned a 404 error. I believe that the video is simply missing, and that you need to put it up in the images directory. This is also the case with the intro.ogv video - it is simply missing.