当 z-index 较高时，图像链接不适用于覆盖 div答案

【问题标题】：Image link not working with overlayed div when z-index is higher当 z-index 较高时，图像链接不适用于覆盖 div
【发布时间】：2013-01-21 06:40:18
【问题描述】：

我在网站上使用超大幻灯片，但我在 div 中添加了纹理叠加

 #slideshow-wrapper
{
    width: 100%;
    margin: -100px 0 0 0;
    padding: 0;
    height: 500px;
    background: url(/slideshow/img/slideshow-front-3.png) repeat;
    position: relative;
    z-index: 3;
}

这是超大的 div

 #supersized
{
    display: block;
    position: absolute;
    left: 0;
    top: -15px;
    overflow: hidden;
    z-index: 1;
    height: 500px;
    width: 100%;
}

如果我将 #slideshow-wrapper 上的 z-index 更改为 0，则链接效果很好，但是我会失去图像上的纹理。

是否有解决此问题的方法，以便链接可以在仍显示纹理叠加层的同时工作？

感谢任何帮助。

干杯

【问题讨论】：

标签： css hyperlink position z-index supersized

【解决方案1】：

您需要在纹理图像上放置一个事件侦听器并捕获鼠标坐标，然后将点击事件传递给它下面应该被点击的项目，它们共享相同坐标空间。

【讨论】：

这是否适用于在 #slideshow-wrapper 下方旋转的多个图像/链接？
当然，您可以使用 jquery 轻松找到偏移量，但归根结底，您应该决定纹理效果是否真的值得所有这些麻烦。
你可以尝试在背景css的末尾添加透明的重复旁边吗？
您好，感谢您的帮助。背景末尾的透明不起作用。我可能会调查事件监听器。这些图像的纹理看起来非常好:-)所以值得一试。干杯
如果有帮助，请检查：stackoverflow.com/questions/3680429/… 此页面上有许多解决方案。