重置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> 

Answer 2

將background-image設置爲none（或初始值）。

我發現直接設置類比特定的html元素更容易，然後添加/刪除這些類。

Answer 3

將背景樣式設置爲空字符串應該將其恢復爲從樣式表繼承的樣式。這假設默認樣式來自樣式表，如果不是，您將不得不手動重置樣式。