リセット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クラスにそのスタイルを置き、代わりにcssのtoggleClassを使用します。

$(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要素にCSSプロパティより直接設定し、これらのクラスを追加/削除する方が簡単です。

Answer 3

バックグラウンドスタイルを空の文字列に設定すると、スタイルシートから継承したスタイルに戻す必要があります。これは、デフォルトのスタイルはスタイルシートからのものであると仮定します。