当我点击第一个DIV时,slideToggle效果正确完成。 当我点击第二个时,它似乎没有应用效果,内容突然出现。
第3个元素与第一个元素相同,但第一个元素也是如此。
发生了什么事? (演示在这里工作:http://jsfiddle.net/SW5sc/6/)
我有这个HTML结构:
<div class="subcategory">Option 1 </div>
<div class="subcategoryContent">
<div class="subcategoryOption">
<div class="image">
<img src="vista/imgs/grupales.gif" alt="Clases grupales" />
</div>
<div class="text">
TEXT
</div>
</div>
</div>
<div class="subcategory">Option 2</div>
<div class="subcategoryContent">
<div class="subcategoryOption">
<div class="image">
<img src="vista/imgs/grupales.gif" alt="Clases grupales" />
</div>
<div class="text">
TEXT
</div>
</div>
</div>
这个jQuery代码:
$(".subcategory").click(function () {
$(this).next(".subcategoryContent").slideToggle(450).siblings(".subcategoryContent").slideUp(450);
return false;
});
答案 0 :(得分:1)
从CSS中删除所有“浮动”属性,它会正常工作! :-)浮动破坏了动画..