欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页

CSS Sprites在IE中不起作用[8/7/6]

程序员文章站 2024-03-11 17:37:13
...

我正在尝试CSS使用精灵来动画我的风险矩阵...它在Firefox和Chrome中运行得很好,但图像不会出现在IE中......

代码在下面,不想在这里粘贴整个东西,但摘录显示了模式:

<dl id="rmMap4x4">
<dd id="m4p4s1">
<a onclick="setDropDownListValues(4,1,3,4)" onmouseover="setDropDownListValues(4,1,-1,4)">
</a>
</dd>
<dd id="m4p3s1">
<a onclick="setDropDownListValues(3,1,2,4)" onmouseover="setDropDownListValues(3,1,-1,4)">
</a>
</dd>
...
</dl>

CSS:

dl#rmMap4x4
{
background:  url(/images/RiskMatrix_4x4.png) no-repeat scroll left top;
height: 400px;
margin: 0pt;
padding: 0pt;
position: relative;
width: 400px;
}
/*column 1*/
dd#m4p4s1 a
{
top: 99px;
left: 99px;
}
dd#m4p4s1 a:hover
{
position: absolute;
background:  url(/images/RiskMatrix_4x4.png) -98px -500px no-repeat;
top: 100px;
left: 99px;
}
dd#m4p3s1 a
{
top: 149px;
left: 99px;
}
dd#m4p3s1 a:hover
{
position: absolute;
background:  url(/images/RiskMatrix_4x4.png) -98px -550px no-repeat;
top: 150px;
left: 99px;
}

我用IE Dev检查了样式。 工具栏(我想要IE的firebug),所有样式都到位,服务器上的图像,但它不会在IE中显示!

我很确定这是一些愚蠢的IE CSS怪癖,请帮忙。

更新: @RoBorg:你的建议没有解决问题,但它解决了“悬停”问题。 问题变成了绝对定位的外部div和一些菜单样式,这些以某种方式搞砸了整个事情。


#1楼

IE不适用:hover在没有href的情况下将:hover<a> 。 这应该工作:

<a href="#" onclick="setDropDownListValues(3,1,2,4); return false;"
     onmouseover="setDropDownListValues(3,1,-1,4);">