0

やあみんな、私は次のメニュー構造を作成しました：

<div id="menu">
<ul>
<li><a href="#">Main Item1</a></li>
<li><a href="#">Main Item2</a></li>
<li><a href="#">Main Item3</a>
    <ul>
    <li><a href="#">SubItem for MainItem3</a></li>
    <li><a href="#">2ndSub for MainItem3</a></li>
    </ul>
</li>
<li><a href="#">Main Item4</a>
    <ul>
    <li><a href="#">SubItem for MainItem4</a></li>
    <li><a href="#">2ndSub for MainItem4</a></li>
    </ul>
</li>
</ul>
</div>

これが私のメニュー構造です。ここで、jQuery最新を使用してSlideUp/SlideDown効果を作成したいと思います。

私はこのようにします：

$(document).ready(function(){
    $('#menu ul li:has(ul)').mouseenter(function(){         
                $('#menu ul li ul').slideDown('slow');                              
    }).mouseleave(function(){
        $('#menu ul li ul').slideUp('slow');
    });
});

最初にマウスオーバーとマウスアウトを試しましたが、その関数を使用すると、マウスオーバーが機能し、サブに移動したいときにメニューが上にスライドしましたが、マウスアウトイベントが発生します。これで動作しましたが、たとえばメインアイテム3にカーソルを合わせると、メインアイテム4のサブもマウスアウトで開閉しますか？！？！メインアイテム3またはメインアイテム4などのメニューアイテムのみを言う方法???

私が何を意味するのか理解していただければ幸いですか？

ありがとう

4

1 に答える 1

1 
$(function(){
    $('#menu ul li:has(ul)').hover(function(){                 
            $(this).find('ul').slideDown('slow');                                                          
    }, function(){
            $(this).find('ul').slideUp('slow');
    });
});
于 2009-11-02T15:42:50.963 に答える