重置CSS背景图片

Question

我正在尝试使用以下JQUERY创建一个手风琴类型菜单:

function initMenu() {
    $('#menu ul').hide();
        $('#menu li a').click(
            function() {
                $(this).next().slideToggle('normal');
                $(this).css("background", "url(customnav_selected.png) top right");
            }
        );
}
$(document).ready(function() {initMenu();});

这是有用的,当我点击它扩展的菜单链接和菜单标题背景更改.

但是,当我再次单击它以折叠菜单时,我希望它能够更改回来.

有人可以帮忙吗？

Answer 1

而不是这个:

$(this).css("background", "url(customnav_selected.png) top right");

将该样式放入CSS类中,并使用toggleClass而不是css,例如:

$(this).toggleClass("selected"); //assuming a class of .selected

所以点击处理程序变为:

$('#menu li a').click(function() {
     $(this).next().slideToggle('normal');
     $(this).toggleClass("selected");
});

和风格:

<style>
.selected  {background: url(customnav_selected.png) top right} 
</style>