使元素出现在顶部，但在可点击的下方[重复]

Posted 2023-03-05

【中文标题】使元素出现在顶部，但在可点击的下方[重复]

【英文标题】：Make element appear on top, but underneath clickable [duplicate]

【发布时间】：2017-04-04 01:52:51

【问题描述】：

我正在尝试制作一个通知系统，其中一个小框出现在屏幕的右上角。 但是，我希望通知下方的屏幕部分是可点击的。就像现在一样，当通知在那里时，您无法与它下面的内容进行交互。如何使其下方的区域可点击？我尝试过使用 z-index、position 和 transform 属性，但它们仍然使通知显示在其他内容之上。

【问题讨论】：

分享你的代码，别害羞

它基于Metro UI framework，所以我真的没有代码。

【参考方案1】：

在弹出框上使用pointer-events: none 以允许点击和光标交互通过它。

请注意，IE10 或更低版本不支持此功能，但仅占用户的一小部分。

http://caniuse.com/pointer-events/embed/