jQuery プルダウンメニュー
プルダウンメニューの一部で行き詰っています。
メニュー１のサブメニューが開いている状態で、メニュー２をクリックした時
メニュー１のサブメニューが閉じるようにする(その逆パターンも含む)。
サブメニューにカーソルがある時、メニューはhoverさせないようにする。
▼html-----------------------------------------
<ul id="gNav">
<li>メニュー1
<ul>
<li><a href="">サブメニュー1-1</a></li>
</ul>
</li>
<li>メニュー2
<ul>
<li><a href="">サブメニュー2-1</a></li>
<li>サブメニュー2-2
<ul>
<li><a href="">サブメニュー2-2-1</a></li>
<li><a href="">サブメニュー2-2-2</a></li>
<li><a href="">サブメニュー2-2-3</a></li>
</ul>
</li>
</ul>
</li>
<li><a href="">メニュー3</a></li>
</ul>
▼jQuery-----------------------------------------
$(function(){
$("#gNav > li").click(function(){
$(this).children("ul").toggle();
});
$("#gNav > li > ul > li").mouseenter(function(){
$(this).children("ul").show();
}).mouseleave(function(){
$(this).children("ul").hide();
});
$("#gNav > li").hover(function(){
$(this).css("background-color","#ff9900");
},function(){
$(this).css("background-color","#ffcc00");
});
$("#gNav > li > ul > li").hover(function(){
$(this).css("background-color","#99cc66");
},function(){
$(this).css("background-color","#669933");
});
$("#gNav > li > ul >li > ul >li").hover(function(){
$(this).css("background-color","#dddddd");
},function(){
$(this).css("background-color","#eeeeee");
});
});
宜しくお願いします。
お礼
ありがとうございました