Html
<ul class="main">
<li class="item_no">Item 1
<ul class="sub_items">
<li>Item 1.1</li>
<li>Item 1.2</li>
<li>Item 1.3</li>
</ul>
</li>
<li class="item_no">Item 2
<ul class="sub_items">
<li>Item 2.1</li>
<li>Item 2.2</li>
<li>Item 2.3</li>
</ul>
</li>
<li class="item_no">Item 3</li>
</ul>
的CSS
ul.main {
list-style-type:none;
}
ul.main li.item_no {
list-style-image:url('arrow.png');
}
ul.main ul.sub_items li {
list-style-image:none;
}
脚本
$(document).ready(function() {
$('ul.sub_items').hide().filter(':lt(1)').show();
$("li.item_no").click(function() {
$(this).find(".sub_items").slideToggle("slow");
});
});
当我单击“ item_no”时，我想将列表样式图像从“ arrow.png”更改为“ arrowdown.png”。
有人知道怎么做吗？？？
试试这个：
$(document).ready(function () {
$('.sub_items').hide().first().show();
$(".main > li").click(function () {
var self = $(this);
self.toggleClass('item_no item_down');
self.children('.sub_items').slideToggle('slow');
});
});
添加此CSS：
ul.main li.item_down{
list-style-image:url('arrowdown.png');
}
本文收集自互联网，转载请注明来源。
如有侵权，请联系 [email protected] 删除。
我来说两句