0

私はこのjqを持っています。これは素晴らしくてシンプルです:

$(document).ready(function($) {
  $('#navigation ul li').hover(function(){
    $(this).find("ul").addClass("MenuBarSubmenuVisible");
  }, function(){
   $(this).find("ul").removeClass("MenuBarSubmenuVisible");
  });
});

ただし、問題はイベントが要素に.hoverバインドされているためです。ただし、複数のul li ulが存在するため、インスタンスである必要がある場合を除いて、ホバー関数のセクションが残されたときにトリガーする必要があります。$('#navigation ul li')mouseLeave$('#navigation ul li ul')$(this)

クラスを適用したり、その他のさまざまな奇妙なことを行ったりするため、CSS(少し前に開発されたWebサイトを利用)だけではこれを行うことはできません。

どうもありがとう。

4

2 に答える 2

1

個人的には、いくつかのjquery効果で拡張されたメニューリンクを作成するときは、常にこのコードを使用します。

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script>
$(document).ready(function() {
 jQuery(".sf-menu a").mouseenter(function(){
      jQuery(this).stop().addClass("MenuBarSubmenuVisible");
    });
    jQuery(".sf-menu a").mouseleave(function(){
      jQuery(this).stop().removeClass("MenuBarSubmenuVisible");
          });

    });
</script>

「.stop」は、ユーザーがリンク上でマウスをすばやく通過したときにアニメーションがキューに入るなどの「奇妙さ」を停止します。

これがjsfiddleです:http://jsfiddle.net/K7Y6w/11/

于 2013-02-18T16:49:22.033 に答える
0

あなたの場合、私はmousenterとmouseleaveのメソッド/セレクターを分離します:

$(document).ready(function($) {
    $('#navigation ul').on('mouseenter','li', function() {
            $(this).find("ul").addClass("MenuBarSubmenuVisible");
    }).on('mouseout','li ul',function() {
        $(this).removeClass("MenuBarSubmenuVisible");
    });
});
于 2013-02-18T16:49:29.960 に答える