2009-02-18 6 views
2

Я пытаюсь использовать спрайты CSS для анимации моей матрицы рисков ... она отлично работает в Firefox и Chrome, но изображение не будет отображаться в IE ...CSS Sprites не работают в IE [8/7/6]

код ниже, не хочу, чтобы вставить все это здесь, но отрывок показывает картину:

<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; 
} 

I проверил стили с помощью IE Dev. панель инструментов (я хочу firebug для IE), и все стили на месте, изображение на сервере, но это НЕ ПОКАЗАТЬ В IE!

Я до сих пор уверен, что это какая-то глупость IE CSS quirk, пожалуйста, помогите.

ОБНОВЛЕНИЕ: @RoBorg: ваше предложение не решило проблему, но решило проблему «зависания». Проблема оказалась внутри с абсолютно позиционированным внешним div и некоторыми стилями меню, которые каким-то образом ввернули все это.

ответ

12

IE не применяется :hover до <a> без href. Это должно работать:

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

 Смежные вопросы

  • Нет связанных вопросов^_^