如何将图像 div 容器放在另一个 div 上，但保持可点击？ [关闭]答案

【问题标题】：How to put image div container over another div, yet keep it clickable? [closed]如何将图像 div 容器放在另一个 div 上，但保持可点击？ [关闭]
【发布时间】：2013-04-30 09:38:13
【问题描述】：

我想将我的图像放在手风琴 div 容器上并使其保持可点击状态，因此我的图像仅在视觉上覆盖它。我该怎么做？

我需要edit is there的页面。这就是我想让我的页面看起来像这样：

提前致谢！

【问题讨论】：

顶部图像必须是png，并且您需要使用position: absolute; 和z-index，所以它位于顶部
我添加了 z-index:2 和 position: absolute 标签，我的图像完全覆盖了我的手风琴块（它不可点击）。

标签： css image html containers layer

【解决方案1】：

实际上，这在大多数带有 CSS 的浏览器中都是可能的（Chrome、Firefox、Safari、IOS、Android。完整列表可用HERE）

img {
    pointer-events: none;
}

DEMO

IE10 或更低版本不支持。

还有一些 Javascript 解决方案，包括使用 Jquery 的 THIS ONE，可在 IE 中使用。

【讨论】：

您的答案中没有答案，只有链接。或许你应该把相关的JS贴在这里，描述一下。
@feeela "指针事件：无；"这怎么不是答案？我提供了指向其他人的 Javascript 解决方案的链接作为进一步阅读
哇，没听说过这个。谢谢你提到它。显然还没有真正准备好广泛使用，但很高兴知道。也非常有趣的 JS 解决方案。不过，在大多数情况下，我还是更喜欢避免这样的花哨的东西。

【解决方案2】：

您将无法将图片放在顶部并让链接可点击。我能想到的唯一解决方案是将图像分成两部分，一个放在手风琴上方，一个放在左边。但是，即使这样做，也意味着蓝色 +s 将不可点击，因为图像必须位于它们上方。让切片图像的两个部分匹配也不会很有趣。（我敢肯定一两个旧浏览器会为你搞砸。）

老实说，我的建议是重新考虑这一点，因为这对于网络来说并不实用。我建议将整个图像作为背景放在手风琴上，并让女孩的手指向链接，而不是真正将鼠标悬停在链接上。

【讨论】：

我是网站建设的新手，我认为这是可能的。好吧，那我会坚持你上面的建议。谢谢！