Place image in front of html video -


i want place image in front of html video. , here code far:

    <style>     video.videos {         background-image: url(image.png);         background-repeat: no-repeat;         z-index:1;     }     </style>  <video id="video1" class="videos" >     <img src="image.png" align="absmiddle" style="z-index:2;" >     <source src="video1.mp4" type="video/mp4"></source>           browser not support html5. video not loaded.  </video> 

but using z-index not make working. mean, image still remains behind video file. there possibility fix this? maybe other way?

place outside video tags , use style position it:

top: 100px; left: 100px; z-index: 0; position: absolute; 

naturally, you'll need adjust values specific application. if absolute positioning doesn't work you, can use relative positioning, can more flexible. see jsfiddle example of positioning image in front of video.


Comments

Popular posts from this blog

javascript - RequestAnimationFrame not working when exiting fullscreen switching space on Safari -

Python ctypes access violation with const pointer arguments -