我有类似于以下的代码:
<div class="container">
<div class="overlay">
// hover content
</div>
<img/>
</div>
.container{
position:relative;
}
.overlay{
display:block;
position:absolute;
top:0;
left:0;
width:100%;
height:100%;
}
基本上,当有人将鼠标悬停在覆盖 div 上时,会显示该 div 的内容。这适用于所有浏览器,除了 IE(当然)
在 IE 中,覆盖 div 位于图像后面,因此悬停不起作用。如果在覆盖 div 上放置背景(颜色或图像),它将定位在图像上并工作,但我想避免使用背景。
我也尝试过使用 z-index,但没有成功。即使使用更高的 z-index,并且在定义的 z-index 堆栈中(对于 IE),它仍然位于图像后面。
这是在所有 IE 版本 6-9 中。
有谁知道这方面的任何解决方法/修复?