问题
I want to add overlay hotspots on a html5 video which will help me give info about that video. I was able to successfully add it on HTML5 Video's normal mode. But, when i change the video mode to fullscreen, it disappears. Want someone to help me please!!!.
回答1:
The best way to do this is to have a <div> containing the <video> and your hotspots, and request fullscreen on the containing <div>.
I implemented the fullscreen and (parts of the) <video> APIs in Firefox. This z-index hack isn't the specified behaviour, so it will stop working once we update our implementation to match the latest draft of the W3C fullscreen spec.
回答2:
This can be solved with a trick. Have a look on this example here: http://jsfiddle.net/carmijoon/pZbkX/show/
z-index: 2147483647;
You can also see the code here: http://jsfiddle.net/carmijoon/pZbkX/
z-index: 2147483647;
you need to add maximum value of z-index which is (z-index: 2147483647;) in to the overlay element. That trick will solve your issue.
Can you also share your file on jsfiddle?
来源：https://stackoverflow.com/questions/16234740/overlay-on-html5-fullscreen-video