html - 如何使背景元素在ipad上不可点击

Question

在我的网站上我有这样的东西:

<div id="videoContainer">
<section id="dynamicContent">lorem ipsum...</section>
<video id="video">
...
</video>
</div>

现在 #dynamicContent 和 #video 位置是绝对的(宽度和高度均为 100%)。我想要 #dynamicContent 覆盖视频。现在在桌面浏览器上一切正常。问题是，当我使用 iPad 进入网站并单击覆盖 block (#dynamicContent) 时，设备试图单击此覆盖 block 下的所有内容。例如:当我点击 #dynamicContent, 的中间时，视频开始播放，即使它在 block 下也是如此。例如，当我在 PC Firefox 中执行相同操作时，没有任何反应，这就是我想要完成的。我该怎么做？

一些 fiddle :attempts

Answer 1

也许是因为你的 <section>是你的 sibling <video>因为它是你的第一个 child #videoContainer它不在 <video> 之上但在下面。

有没有涉及到js？