HTML“重叠式广告”，可让点击进入其背后的元素

Question

我正在尝试在网页顶部叠加一个元素（以绘制任意图形），现在我可以将其堆叠在所有内容之上的元素中，但这阻止了用户单击任何链接/按钮/等。有没有办法让其内容浮动在所有内容之上（它是半透明的，因此您仍然可以看到背后的内容），并使用户与其下面的层进行交互？我已经找到了有关DOM事件模型的很多信息，但是这些信息都没有解决按钮和其他“本机”控件似乎从未获得过点击的问题。

Answer 1

添加pointer-events: none;到叠加层。

原始答案：我的建议是，您可以捕获带有叠加层的click事件，隐藏叠加层，然后重新触发click事件，然后再次显示叠加层。我不确定您是否会获得闪烁效果。

[更新]正是这个问题，而我的解决方案也刚出现在这篇文章中：“ 通过层转发鼠标事件 ”。我知道对于OP来说可能有点晚了，但是为了将来有人遇到这个问题，我将其包括在内。

Answer 2

为了记录，一种替代方法可能是使可单击的层成为覆盖层：将其设置为半透明，然后将“覆盖层”图像置于其后（有些与直觉相反，那么“覆盖层”图像可能是不透明的）。根据您要执行的操作，您可能能够获得完全相同的视觉效果（图像和可点击层半透明地叠加在一起），同时避免了可点击性问题（因为“重叠式广告”实际上是在后台）。