1

これと同じメニューを作成する必要があります。

http://www.girard-perregaux.com/collection/univers-en.aspx?type=1

コレクションをクリックしてからメーカーをクリックし、もう一度メーカーをクリックして閉じます。ご覧のとおり、最初に下にスライドし、その後、同じ開いている要素をクリックするまで、上下にスライドせずにリンクを変更します。

私は最初にこれを試しました：

$('ul.sub-menu').hide();
$('.sf-menu').children('li').click(function(){  
    $(this).children(".sub-menu").slideToggle('slow');
    $('ul.sub-menu').hide();

動作しますが、メニューをクリックするたびに上下にスライドし、リスト項目を変更するだけではありません。だから私はどういうわけかulの代わりに子li要素をターゲットにする必要があると考えました。また、親のリスト項目間をクリックすると、そのメニューのように切り替える必要がありますが、同じ開いているリスト項目をもう一度クリックすると、閉じる必要があります（上にスライドします）。

私はそれを理解しようとして半日を費やしたので、これに感謝します。また、子供をターゲットにする方法li、私はこれを試しました：

$('.sf-menu').children('li').click(function(){  

$(this).children(".sub-menu li")

しかし、何もありません。

4

1 に答える 1

1

クリックをサブメニューにバインドして、およびを使用してみることができますe.stopPropagation()： http e.stopImediatePropagation(): //jsfiddle.net/7eCjd/

$menu.find(">li>ul").on("click", function(e) {
    e.stopPropagation();
    e.stopImediatePropagation();
});

これにより、サブメニューをクリックしたときにサブメニューを閉じることができなくなります。

于 2012-07-04T22:50:16.340 に答える