MediaElement.js not displaying video in Firefox with Linux

Question

I'm programing a video visor with MediaElement.js

The web retrieves a video from a path, in server side im using PHP to do that.

It works really well in IE, Firefox or Chrome (either Windows or Mac). In Firefox Linux (ver 24.0) it's displaying all the time the gray box with the famous message No video with supported format and MIME type found.

I tried installing codecs at my CentOS or installing Opera (failed as well, even in Windows). Also I added at the htaccess the MIME types required.

I don't know what's going on.

<div id="div_video">
    <video id="Video1" width="640" height="360" controls="controls" >
    <source src="videos/<?php echo $client.'/'.$main_video[2]?>" type="video/mp4" title="mp4" />
    </video>
</div>

What I realize is when I'm reproducing a video from the demo in Firefox, IE or Chrome (Windows) it says native but when I'm reproducing a video in Opera (Windows) it says flash and is never working at all.

Hope you can help me! Thanks

score 1 · Answer 1 · answered Apr 10 '14 at 05:19

it appears that your flash fallback is not working. This could be for a number of reasons but the most likely reason is that the flashmediaelement.swf file isn't in the same directory as the included mediaelementplayer.js file.

To fix this put the flashmediaelement.swf file in the same directory as the included javascript file. If you do not have it you can redownload it from the site http://mediaelementjs.com/ (look in the build directory).

If you don't want to put it in the same folder you could also use code like this to hook it up to the right file.

$('#Video1').mediaelementplayer({pluginPath:YOURPATHHERE});

score 0 · Answer 2 · edited May 23 '17 at 11:49

Yes, I second the answer of faithfulprogrammer. Another fast solution could be convert the mp4 in webm and serve two files (for how to do this, have a look here: How to create a webm video file?). Or you could do both: fix flash fallback and provide webm.

By the way, the mp4 playback works in HTML5 in Firefox because it relies on the mp4 codecs of the platform: windows 7+ since Firefox 21, Windows Vista since 22, Android since 20, and Linux since version 26 if GStreamer codecs are installed (source). Bear in mind that firefox on Mac cannot play mp4 files as of now.

MediaElement.js not displaying video in Firefox with Linux

2 Answers2