2011-06-23 12 views
0

折りたたみ可能な垂直メニューに苦しんでいます。以下のスクリプトの最初の部分は動作します。そのため、上位ULは兄弟LIを表示し、他のULは兄弟LIを非表示にします。 私の難しい課題は(少なくとも私にとっては)アクティブなリンクの親ULが兄弟LIを見えるようにすることです。これは私がスクリプトの下部で試したことです。 私のa-linkは何度か、私がアクティブなURLと比較するために削除したいと思っている末尾のハッシュ(#)を取得します。これはtrimHash(string)-functionによって行われます。これは単純な文字列でテストされたときに機能しますが、このスクリプトでは機能しません。 良いアドバイスはありますか?折りたたみ可能なメニューjavascriptの問題

$(document).ready(function() { 
     // Collapse everything but the first menu: 
     $(".mainmenu > li > a").not(":first").find("+ ul").slideUp(1); 
     // Expand or collapse: 
     $(".mainmenu > li > a").click(function() { 
      $(this).find("+ ul").slideToggle("fast"); 
     }); 

    $(".mainmenu li").each(function() { 
     var li = $(this); 
     var a = rtrimHash(li[0].firstChild); 

     if (a.href == location.href) { 
      $(this).find("+ ul").slideDown(1); 
     } 
    }); 

答えて

0

私はこの解決策に終わった。それはWordPressのサイトであるので、メニュー内のメニュー項目を踏んでいる間に、アクティブな投稿へのリンクを比較して各リンクがアクティブかどうかを確認し、これらのメニュー項目に「現在の」クラスを挿入することができます:

echo '<li class="child'; 
if ($menuPost->ID == $post->ID) { echo ' current'; } 
その後、

およびLi、「現在の」クラスのすべてのインスタンスを見つけ、slideDownに親のULのをトリガするためのjQueryを使用します。

$(document).ready(function() { 
    // Collapse everything: 
    $("li.cat").find("+ ul").slideUp(1); 

    // Collapse everything but the first menu: 
    //$("li.cat").not(":first").find("+ ul").slideUp(1); 

    // Expand or collapse: 
    $("li.cat").click(function() { 
     $(this).find("+ ul").slideToggle("fast"); 
    }); 
    $("li.current").parent().slideDown(1); 
}); 

申し訳ありませんが、私が意図したとおり、私はjavascriptを介してこれを解決していないが、私は何を達成私は欲しかった。

関連する問題