Youtube embed does not work in firefox

Question

I have three built-in Youtube videos that work fine in all browsers except Firefox.

I went through the cache cleaning on the server side, cleared cookies and the cache locally, tried 18 different computers, tried Windows 7, Windows 8, Linux Ubuntu 12.10, Fedora 16, Mac OSX, iOS, Android 4.0.3. I tried versions 7 through 15 of Firefox.

I even tried to redesign the site from scratch.
Same problem ... Videos do not load only in Firefox and Firefox.

What am I doing wrong?

I looked through everything, asked the IRC, posted questions on the forums, but no luck.

I even tried the old youtube embed codes. Vimeo embed iframes works great!

My code is as follows: http://pastebin.com/T3w09bqW
- Please note: the average video uses the old youtube embed code.

Here is the image.

Answer 1

Found this on a website, hoping this helps:

It seems that the problem only occurs when youtube shows a flash version of the video, and with html5 it works. You can force YT to serve the html5 version of the video by adding this to the iframe insert code: html5 = 1

<iframe src="http://www.youtube.com/embed/_VIDEO_ID_?html5=1" [...]></iframe> 

Consider also that if the html5 version for the movie for Firefox is not available, YT serves, however, flash video as a backup. Therefore, the problem is certainly related to the flash.

// edit changed & html5 = 1 to? html5 = 1

Answer 2

Check the parent to see if CSS3 transform is applied. Our videos stopped working on FireFox 24-26 until we pulled the following code from the parent wrapper element:

  transform: translate3d(0,0,0); 

In this particular case, 3D conversion was applied to make things better in Chrome, (hence (0,0,0), but if you search through your CSS for conversion and find the entry, try pulling this or testing in FireBug in first of all.