0

私はレスポンシブ サイトを作成し、mobilebuild に取り組んでいます。メニューバーがあり、これをクリックするとメニューがスライドダウンします。私の唯一の問題は、追加したいサブメニュー項目がいくつかあり、私が持っているjQueryとcssが私がやろうとしていることと競合していることです。サブナビゲーションでメニュー項目をクリックしたときに、これが下にスライドしない理由を誰かが見ることができますか?

メニューの仕組みへのリンクは次のとおりです。http://jsfiddle.net/ndT7H/1/

私は次の方法でjQueryを使用しています：

$('ul#nav-2 > li > ul > li a').click(function () {
    $('ul.sub-menu').slideUp('normal');
    if ($(this).next('ul.sub-menu').is(':hidden') == true) {
        $(this).next('ul.sub-menu').slideDown();
    }
});

私はこの例からそれを使用しており、コードは別のファイルで機能していますが、現在のサイト用のコードでは機能していません。 http://jsfiddle.net/senff/9cK3X/3/

これが機能すると、メニュー項目に + 記号が表示され、メニューをクリックして展開するようにユーザーに通知されます。また、開いたときにサブメニューを上にスライドさせるためにマイナス記号が表示されます。

ありがとう

4

2 に答える 2

0

このようなもの？

HTML

$('.dropdown').click(function () {
    $(this).siblings().find('ul ul').slideUp();
    $(this).find('ul#nav-2').find('> li > ul').slideToggle();
});

$('ul#nav-2  li  ul  li a').click(function (e) {
    e.stopPropagation();
    $(this).closest('ul').find('> li > .sub-menu').not($(this).next('ul.sub-menu').slideToggle()).slideUp('normal');
});

CSS

#nav-2 > li > ul {
    background:#FFF;
    left:0;
    top:56px;
    position:relative;
    color:#000;
    display:none;
    width:100%;
}

デモ

于 2013-07-08T15:07:17.870 に答える