jQuery addClass()在IE6中不起作用

时间:2009-12-22 03:13:25

标签: jquery css

如果您查看this screenshot,我会尝试在您点击它时在链接下显示红色图片。如果单击“链接2”,它将显示在链接2下。

它在IE 6以外的所有主要浏览器中工作。当我点击IE 6中的链接时,它会加载ul的on类,但图像不会显示。

任何人都可以看到我的代码有问题吗?

提前感谢您的帮助!

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

2 个答案:

答案 0 :(得分:1)

问题在于IE6,而不是您的代码。我会开始通过警告谁是父母以及谁是IE6中的兄弟来调试这个。

答案 1 :(得分:1)

IE6透明png有问题。你必须使用png修复 - 那里有很多选项。也许首先尝试使用非.png来确定。

如果这不是问题,或者尝试删除ul中所有li元素的'on'类,而不是调用.siblings()。

您也应该关闭该图片代码。