CODEWITHSUNDEEP
jqueryhtmlexpressionenginemediaelement.js
Joe Bobby
Joe Bobby

Reputation: 2811

mediaelement.js: Getting videos to work in Firefox

This seems like a common issue but I have not found any questions that have an answer marked so thought I would create one in hopes of finding a solution.

My videos work fine in Chrome and Safari but when it comes to Firefox it doesnt display at all.. my CMS is ExpressionEngine if that helps any. Does anyone have experience with this?

The inserted code for the video on the page:

<video width="640" height="360" preload="none" controls="controls" poster="http://site.com/img.jpeg" id="player1" type="video/mp4" src="http://site.com/content/videos/videotest(360p_H.264-AAC).mp4" tabindex="0"></video>

Upvotes: 0

Views: 1625

Answers (3)

iCodr8
iCodr8

Reputation: 1

My problem was the wrong convertion from mp4 with the MIRO Converter. If I used "Other -> mp4" it doesn't work. If I used "Apple -> iPad" I got the correct mp4 file and it runs!

Upvotes: 0

r8n5n
r8n5n

Reputation: 2059

Another thing to check is that you have the correct MIME types setup on your server.

You can add these to the .htaccess file,

AddType video/ogg .ogv
AddType video/mp4 .mp4
AddType video/webm .webm

See http://mediaelementjs.com/#installation for more informaition.

Upvotes: 1

VVV
VVV

Reputation: 7603

For testing purposes replace your video tag with these videos (from mediaelement's website)

<video id="player1" width="540" height="303" controls="controls" preload="none">
    <source src="
http://mediaelementjs.com/media/echo-hereweare.mp4" type="video/mp4" />
    <source src="
http://mediaelementjs.com/media/echo-hereweare.webm" type="video/webm" />
    <source src="
http://mediaelementjs.com/media/echo-hereweare.ogv" type="video/ogg" />
</video>

If the above code works in FF, then the problem is related to video compression for FF. Like you I've had some problems with mediaelement.js but it turned out it was my videos that weren't well compresseed.

Upvotes: 2

Related Questions