css 100%宽度背景遮罩，可访问下方的滑块

我已经在图像滑块上放置了以下CSS div掩码

<div class="contentMaskWrapper" >
    <div class="contentMaskLeft"></div>
    <div class="contentMaskRight"></div>
</div>
<div id="slider">
   slider content      
</div>

.contentMaskWrapper{
width:100%;
overflow:hidden;
position:absolute;
z-index:3;
height:564px;
    }
.contentMaskLeft{ 
background:url(../images/mask.png) repeat;
height:564px;
width:100%;
position:absolute;
left:50%;
margin-left:425px;
z-index:999;
}
.contentMaskRight{ 
background:url(../images/mask.png) repeat;
height:564px; 
width:100%; 
position:absolute; 
right:50%; 
margin-right:425px; 
z-index:999;
}
#slider{ 
width:850px; 
height:564px; 
margin:0 auto 20px; 
position:relative; 
clear:both; 
overflow:hidden; 
width:100%; }

滑块内容
.contentMaskWrapper{
宽度：100%；
溢出：隐藏；
位置：绝对位置；
z指数：3；
身高：564px；
}
.contentMaskLeft{
背景：url（../images/mask.png）重复；
身高：564px；
宽度：100%；
位置：绝对位置；
左：50%；
左边距：425px；
z指数：999；
}
.contentMaskRight{
背景：url（../images/mask.png）重复；
身高：564px；
宽度：100%；
位置：绝对位置；
右：50%；
右边距：425px；
z指数：999；
}
#滑块{
宽度：850px；
身高：564px；
保证金：0自动20px；
位置：相对位置；
明确：两者皆有；
溢出：隐藏；
宽度：100%；}

显示视觉正确的遮罩位于图像滑块的任一侧。滑块有一个链接，此链接仅在IE（7+）中工作，而不在FF、Safari或chrome（Mac或PC）中工作

希望这是有意义的。如果你需要更多信息，请告诉我。感谢您的帮助。 谢谢

---

Jamie

这显然是因为两个遮罩都覆盖了滑块中的链接。（它们具有更高的z指数，且仅由每个遮罩边缘覆盖的区域也算作覆盖）

---

一个解决方案可以包括无边距的绝对定位（左掩模分别为左：0px；右），或者您可以尝试将滑块放在掩模顶部，但只使用真正需要的大小（在您的示例中是425px*2=850px）

，正如我注意到的那样。您的遮罩与滑块重叠。将滑块置于上方，使其z索引高于遮罩，尝试更改其位置