0

Here is my fiddle link which has the codes... my problem is that the drop-down menu in level-one works, but the 2nd level dropdown menu doesnot... It doesnt disappear when i take cursor away from the element and take to the 2nd item in the menu..

enter image description here

What is wrong? My HTML is as below

<div id="menu">
    <ul class="topnav">
        <li><a href="#">Live-Radio</a></li>
        <li><a href="#">Blog</a></li>
        <li><a href="#">Profile</a></li>
        <li><a href="#">Home</a></li>
        <li>
            <a href="#">Songs</a>
            <ul class="subnav">
                <li>
                    <a href="#">Sub Nav Link</a>
                    <ul class="subnav2">
                        <li><a href="#">Sub21a</a></li>
                        <li><a href="#">Sub22a</a></li>
                    </ul>                 
                </li>
                <li><a href="#">Sub Nav Link</a></li>
            </ul>
        </li>
    </ul>
</div>

I want this kind of html markup for the drop down. You can checkout the detailed codes in the link..... here is some jquery that I think has the problem with (but dono what it is) taken from the code...

JS :

//for my second subnav menu

$(this).parent().find("ul.subnav").hover(function() {
    $(this).find("li ul.subnav2").slideDown('fast').show(); //Drop down the subnav2 on hover
} , function () {
    $(this).find("li ul.subnav2").slideUp('fast'); //Drop down the subnav2 on hover
});
4

1 に答える 1

2

要素を子としてli持つのみをターゲットにする必要があります。.subnav2

    $(this).parent().find("ul.subnav").find('li ul.subnav2').parent().hover(function() {
        $(this).children("ul.subnav2").slideDown('fast').show(); //Drop down the subnav2 on hover
    } , function () {
        $(this).children("ul.subnav2").slideUp('fast'); //Drop down the subnav2 on hover
    });

デモ: http://jsfiddle.net/ehNrE/14/

ちなみに、.parent().find(...)は と同じ.siblings(...)です。また、タグ名を削除すると、セレクターのパフォーマンスが向上します (タグ名を保持する唯一の理由は、複数のタグ タイプが同じクラスを持っているか、Internet Explorer 5.5 をサポートする必要があるため、特定のタグ タイプのみを選択する必要がある場合です)。

ul.subnavに変わり.subnavます。

于 2012-01-02T11:27:52.290 に答える