リンク項目のいずれかにカーソルを合わせると、メニューにわずかに重なるアニメーションの矢印が表示されるナビゲーション メニューがあります。
問題は、メニューの上にある矢印の部分にマウスを合わせると、メニューのホバー状態が消えることです。矢印の上にマウスを置いたときにメニューのホバー状態がアクティブのままになるように変更するにはどうすればよいですか?
リンク項目のいずれかにカーソルを合わせると、メニューにわずかに重なるアニメーションの矢印が表示されるナビゲーション メニューがあります。
問題は、メニューの上にある矢印の部分にマウスを合わせると、メニューのホバー状態が消えることです。矢印の上にマウスを置いたときにメニューのホバー状態がアクティブのままになるように変更するにはどうすればよいですか?
問題の核心は、JQuery の mouseenter/mouseover イベントと mouseleave/mouseout イベントの違いにあると思います。ハンドラーをバインドした要素の上にある要素をカーソルがポイントしている場合、バブリングしていない mouseenter を使用しているようです。私が正しければ、mouseenter を mouseover イベントに置き換えてみてください。mouseleave/mouseout ペアと同じです。ここに詳細な説明があります: http://api.jquery.com/mouseenter/
次のようにバブリング イベントを使用する必要があります。
$('#mymenu').mouseenter(function(){...})
.mouseleave(function(){...});