0

カスタム視差 Web サイトのサブメニューを含むメニューを作成していました。親メニューをクリックすると; 必要なサブメニューが表示されたままになります。私がしたいのは、他の親メニュー項目がクリックされたときにサブメニューを非表示にすることです。私はjクエリが初めてなので、本当に助けを借りることができました。これが私のコードです..

HTML

<ul class="navigation">
    <li data-slide="2">estate
        <ul class="navigation2">
            <li data-slide="2">land</li>
            <li data-slide="3">varietal</li>
            <li data-slide="4">people</li>
            <li data-slide="6">practices</li>
            <li data-slide="9">future offerings</li>
        </ul>
    </li>
    <li data-slide="10">about</li>
    <li data-slide="13">location</li>
    <li data-slide="14">contact</li>
</ul>

CSS 

.navigation {
    position:fixed;
    text-align:center;
}
.navigation li {
    display:block;
}
.navigation li:hover, .active {
    cursor:pointer;
    text-decoration:underline;
}
.navigation2 {
    position:fixed;
    text-align:right;
    left:50%;
}
.navigation2 li {
    color:#000;
}
.navigation2 li:hover, .active {
    cursor:pointer;
    text-decoration:underline;
}

Jクエリ

$('.navigation2').hide();
$('.navigation').children().click(function () {
    $(this).children('.navigation2').slideToggle(1000);
}).children('.navigation2').click(function (event) {
    event.stopPropagation();

});
4

2 に答える 2

0

クリック イベントの開始時に、現在の li の兄弟の navigation2 要素を非表示にします。

$('.navigation').children().click(function () {
    $(this).siblings().children('.navigation2').hide(); //add this line
    // rest of your code here.
});
于 2013-09-10T17:16:36.217 に答える