[WordPress] サイドバー トグル ドロップ ダウン メニューの作成に関する問題

スポンサーリンク

Question

http://www.variied.com/market/men/ に取り組んでいます。誰かが後に表示されるサブメニューでコンテンツを切り替えるはサイドバーに「トップ」リンクに当たったときにトリガーされるサイドバーにトグル] ドロップダウン メニューを作成しようとしています。ここでは私の現在のコード



答え

このバイオリンにいくつかの問題がある:

  1. (限り、あなたは
    return false

    を好む)

    e.preventDefault()

    を使用できるように

    event

    を渡している

  2. それはちょうど
    submenu

    をする必要があります

    #submenu

    と呼ばれるクラスがある

  3. display: none

    を subnav

    ul

    を設定し、ちょうどそれを切り替えることを示唆しよりよい効果のため

    slideToggle

    を使用すると思います

JS

$("#menu-item-746").click(function(e) {
  e.preventDefault();
  $(this).next("ul").slideToggle();
});

HTML


CSS

.submenu ul{
  display: none;
}

バイオリン

更新

あなたのサイトにあなたの HTML を見て、それは

ul

subnav (それはあなたのフィドルの兄弟)、兄弟ではなく、

li

の子であることが表示されます。これを試してください:

$(this).find("ul").slideToggle();

もコードからあなたが提供してターゲットにしている、

id

その 1 要素のために働くだけを意味します。それは、subnav を持つものがあるので、それをターゲットは

.menu-item-has-children

と呼ばれるクラスが表示されますよう:

$(".sub-menu .menu-item-has-children").click(function(e) {
   e.preventDefault();
   $(this).find("ul.sub-menu").slideToggle();
});

新しいアップデート

し、

a

を対象:

$(".sub-menu .menu-item-has-children a").click(function(e) {
   e.preventDefault();
   $(this).siblings("ul.sub-menu").slideToggle();
});

http://stackoverflow.com/questions/27758699/problems-creating-sidebar-toggle-dropdown-menu

スポンサーリンク

Leave a Reply