Search code examples
htmlcssytplayer

Why does my element is not visible with z-index 10000


I am developping a website with youtube videos, and I am using mb.YTPlayer plugin. You can see it here : http://orthopluss.fr/test/index.html#prestations

There are two arrows, one on the right, one on the left, which I would like to put ON the video. For example, if I take the left arrow and remove the margin-left, the arrow is positioned behing the video. I tried adding a z-index : 10000 on the #timelapse-prev button but it doesn't get the button in front of the video.

I have been to do it on the demo plugin page (using the developper tools) : http://pupunzi.com/mb.components/mb.YTPlayer/demo/demo_as_player.html so I am assuming that's something from my page that causes an issue...

I tried many things (setting other z-index differentely) but it has no effect. Do you have an idea what would cause such a behavior ?

Thanks !!


Solution

  • Thank you Mark Perera and Vincent G :

    The answer is that I have to add a specific position property. Adding position:relative and z-index:10000 is enough to make the element on top of the video !

    Sorry for the trouble ! Thank you all !