覆盖HTML5全屏视频

Question

我想在html5视频上添加叠加热点,这将帮助我提供有关该视频的信息.我能够在HTML5 Video的普通模式下成功添加它.但是,当我将视频模式更改为全屏时,它会消失.希望有人帮助我!!!

Answer 1

这可以通过技巧解决.看看这个例子:http: //jsfiddle.net/carmijoon/pZbkX/show/

z-index:2147483647;

你也可以在这里看到代码:http: //jsfiddle.net/carmijoon/pZbkX/

z-index: 2147483647;

你需要将z-index的最大值(z-index:2147483647;)添加到overlay元素中.这个技巧将解决你的问题.

你也可以在jsfiddle上分享你的文件吗？

Answer 2

最好的方法是让<div>包含<video>和您的热点,并在包含<div>的请求全屏.

我在Firefox中实现了全屏和(部分)<video> API.这个z-index hack不是指定的行为,所以一旦我们更新我们的实现以匹配W3C全屏规范的最新草案,它将停止工作.