jQuery addClass () не работает в IE6

Question

Если вы посмотрите на этот снимок экрана , я пытаюсь, чтобы при нажатии на него отображалось красное изображение под ссылкой. Если вы нажмете ссылку 2, она отобразится под ссылкой 2.

Он работает во всех основных браузерах, кроме IE 6. Когда я нажимаю ссылку в IE 6, он загружает класс on для ul, но изображение не отображается.

Может кто-нибудь увидеть проблему с кодом, который у меня есть?

Заранее спасибо за помощь!

Вот HTML:

<ul id="slider-links">
 <li class="on"><a href="#">Link 1</a><img src="img/slider-handle.png" width="316" height="42"></li>
 <li><a href="#">Link 2</a><img src="img/slider-handle.png" width="316" height="42"></li>
 <li><a href="#">Link 3</a><img src="img/slider-handle.png" width="316" height="42"></li>
</ul>

Вот jQuery:

$("#slider-links a").click(function(){
 $(this).parent().siblings(".on").removeClass("on");
 $(this).parent().addClass("on");
});

Вот CSS:

#slider-links li {
 position: relative;
 z-index: 8000;
 background: #bed2d9;
 border-bottom: 1px solid #69868f;
}
#slider-links li.on a {color: #dbdbdb;}
#slider-links li a {
 padding: 10px 15px;
 display: block;
 color: #234a5b;
 font-size: 16px;
 font-weight: bold;
 text-decoration: none;
 position: relative;
 z-index: 10000;
}
#slider-links li.on img {display: block;}
#slider-links img {
 position: absolute;
 top: -1px;
 left: 0;
 z-index: 9000;
 display: none;
}

Answer 1

IE6 имеет проблемы с прозрачными PNG. Вам придется использовать исправление png - там много вариантов. Возможно, сначала попробуйте не .png, чтобы быть уверенным.

Если это не проблема, возможно, попробуйте удалить класс on для всех элементов li в ul вместо вызова .siblings ().

Вам, вероятно, следует также закрыть этот тег изображения.

Answer 2

Проблема в IE6, а не в вашем коде. Я бы начал отлаживать это, предупреждая, кто является родителем и кто является родным братом в IE6.