0

I've an issue on the homepage of; http://lcpdevelopment.flourishsales.co.uk/

We have a video uploaded as a background, but on some older browsers and mobile devices the video does not play for various reasons, which is fine - but I would like to replace it with an image when it does not play.

I've tried various things but just can't figure out how to place an image over the exact space of the video, only when the video doesn't play?

Josh Nattrass
  • 3
  • 1
  • How are you displaying the video? Some players allow you to specify a placholder like that - jwplayer comes to mind. – patricksweeney Jul 06 '15 at 13:19
  • Hi Patrick, it's just using a webm files through – Josh Nattrass Jul 06 '15 at 15:06
  • Have you tried this: http://stackoverflow.com/a/9723561/24875 - basically it looks like you just need an image tag somewhere inside the video tag. Not sure exactly why the poster attribute isn't working. – patricksweeney Jul 06 '15 at 15:16
  • Excellent! The image now shows in place of the video using this `` However I can't seem to set the min-width and it just goes to 100% (which on a mobile displays incorrectly when scrolling horizontally). Any suggestions? – Josh Nattrass Jul 06 '15 at 15:33

1 Answers1

0

Check the poster attribute in your code. It's right now redirecting to lcpbg.png, but when I try your website + that image link (so this), I get a 404. Get it to redirect to images/lcpbg.png and it should add a still image.

Rvervuurt
  • 8,589
  • 8
  • 39
  • 62
  • Thanks, you're correct that was wrong, however there was no result by changing it as per your suggestion :( – Josh Nattrass Jul 06 '15 at 15:04
  • With me, it still redirects to `poster="lcpbg.png"` instead of `poster="images/lcpbg.png`: http://i.imgur.com/ljMJ0m1.png – Rvervuurt Jul 07 '15 at 07:10