Fallback for video background in html5

Question

I am trying to add a static image as fallback for video background in html 5 but not getting the output can anyone help.

 <div class="background-wrap"> <video id="video-bg-elem" preload="auto" autoplay loop muted> <source src="media/Digital Marketing Agency in CT - Mediaboom.ogv"> <img src="/media/staticimage.jpg" title="Your browser does not support the <video> tag"> Video not supported </video> </div> 

Answer 1

Check for you image path and replace the <video> tag in the title with < > < >

<div class="background-wrap">
    <video id="video-bg-elem" preload="auto" autoplay loop muted>
        <source src="media/Digital Marketing Agency in CT - Mediaboom.ogv">
    <img src="/media/staticimage.jpg" 
      title="Your browser does not support the &lt;video&gt; tag">

        Video not supported
    </video>
</div>

Answer 2

I suggest that instead of using an image inside the video area, you use a background image.

#video-bg-elem {background-image: url(media/staticimage.jpg);}

<div class="background-wrap">
 <video id="video-bg-elem" preload="auto" autoplay loop muted>
  <source src="media/Digital Marketing Agency in CT - Mediaboom.ogv">
  Video not supported
 </video>
</div>