使元素不可点击（点击它背后的东西）

Question

当用户正在滚动触摸屏（移动设备）时，我有一个固定的图像覆盖页面。

我希望将该图像设置为“不可点击”或“不活动”或其他任何内容，以便如果用户触摸并拖动该图像，其背后的页面仍会滚动，就像图像不在那里“阻止”交互一样

这可能吗？如果需要，我可以尝试提供屏幕截图，例证我的意思。

谢谢！

Answer 1

设置CSS - pointer-events: none应该删除与图像的任何鼠标交互。在IE以外的所有方面都支持得很好。

值pointer-events的

Here's a full list可以使用。

Answer 2

CSS指针事件是您想要查看的内容。在您的情况下，将指针事件设置为“无”。 看一下这个JSFiddle的例子...... http://jsfiddle.net/dppJw/1/

请注意，双击图标仍会显示您单击该段落。

div.child {
    ...    
    background: #fff;
    pointer-events: none //This line is the key!
} 

Answer 3

如果您想使用JavaScript：

document.getElementById("x").style.pointerEvents = "none";

<a href="https://www.google.com" id="x" />Unclickable Google Link</a>
<br>
<a href="https://www.google.com" id="" />Clickable Google Link</a>