我正在编写一个网络应用程序，我需要在其中显示视频和一些(非标准)控件，它们应该出现在叠加层中。因此，创建一些 div 并将它们放置在视频上，并使用更高的 z-index。
不过，在 iPhone 和 iPad 上，这些控件似乎不可点击。我为点击事件注册了 Action ，但是当我点击控件时根本没有触发。我知道在视频实际播放时我无法控制(它甚至会全屏显示)，但问题是即使视频停止，控件也无法使用。
我还尝试从视频中删除 controls 属性，但没有效果。
Is there a way to register click events for elements that are positioned over a video on iPhone/iPad?
最佳答案
我遇到了同样的问题，通过设置 HTML5 video 元素的 CSS 属性使其正常工作
暂停到-webkit-transform:scale(0.01);
播放到-webkit-transform:scale(1);
问题是 iOS 上的 HTML5 视频元素似乎劫持了包含在视频元素边界框内的区域(位于顶部的元素)中的点击事件。如果使用 scale(0.01) 使边界框变小或使用 translateX(-2560px) 将边界框推离屏幕，则没有元素区域直接位于视频元素上方，并且将触发点击事件。
关于javascript - 控制 iPhone/iPad 上的视频覆盖，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/8325311/