Video img overlay on Firefox

Get Started
1

I am trying to set an image overlay with my video using html5 code. Well the overlay shows up great in all browsers but Firefox, The issue I am having is the video overlay is showing above the actual play button when viewed in firefox.

Is there anyway to have the image over lay not show up when the visitor is using Firefox, but it does show up when they are on other browsers?

Here is what it looks like on Firefox.

2

No, it’s better to fix the problem with Firefox. We’ll need to see the page to help with that, though.

3

Here is the page where it is happening.

https://www.pmxusercon.com/
4

Which version of Firefox?

In FF 25.0.1 on Ubuntu, I see this:

Clicking the image starts the video.

In Chromium (and Epiphany) I see this:

Clicking the image doesn’t do anything.

5

I am running 25.0.1 of firefox. And I had to move the file so it didnt interfere with traffic.

https://www.pmxusercon.com/video-test.php
6

Also, Firefox wont play the video when I use the OnClick . Here is the codes I am using.

JS

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js" type="text/javascript"></script>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<link href="videos/video-js.css" rel="stylesheet">
<script type="text/javascript">var video = document.getElementById('video');
video.addEventListener('click',function(){
video.play();
},false);</script>

Video Code

<video controls preload="none" width="958" height="538" style="outline:none" 
  poster="https://www.pmxusercon.com/img/video-overlay.jpg">
 <source src="https://www.pmxusercon.com/videos/PMX2013Video.mp4" type="video/mp4">
  <source src="https://www.pmxusercon.com/videos/PMX2013Video.webm" type="video/webm">
</video>
7
Off Topic:

I’ve tried to visit your site several times, but it just won’t load for me. :frowning:

8

Its coming up good for me and a buddy in WA state.

9

I’m (briefly) using Windows 7. Using the link in post #5, FF25.0.1 shows the double image, but plays the video when the smaller image is clicked. Chrome, Opera and IE11 all show the larger image only and the video cannot be started by clicking on this.

This doesn’t seem to be the behaviour you’re reporting or expecting, but perhaps I’ve misunderstood you?

10

Its because I have tested and tried many things to get it to work and I just left it at that. I think I am just going to use JWPlayer so I know it will work.