1

クリックするとアクティブになるドロップダウンメニューがあります-問題ありません。マウスアウトすると閉じます - 問題ありません。また、メニュー項目をクリックすると閉じるようにしたい-問題。

クリックして閉じると閉じますが、マウスを動かすとすぐに非表示のクラスが再度切り替えられ、おそらくマウスアウトと衝突します。

私はjqueryにかなり慣れていないので、明確に説明してください。

クラス 'visuallyhidden' は単に可視性: 非表示です。

$body.on('click', 'a.user', function(e){
      $('ul.user-links').toggleClass('visuallyhidden');
  });

  $body.on('click', 'ul.user-links', function(e){
      $('.user-links').toggleClass('visuallyhidden');
  });

  $body.on('mouseout', 'ul.user-links', function(e) {
      if($(e.toElement).parents('ul.user-links').length < 1) {
        $('ul.user-links').toggleClass('visuallyhidden');
      }
  });
4

1 に答える 1

0

ええと、問題はあなたが使用しているという事実によって引き起こされていると思いますtoggleClass(); あなたclickがメニューを実際toggleClass()に声に出すとき、しかしあなたがもう一度mouseout()それをするときtoggleClass()。mouseoutのようなコントロールを適用してみてください

if($('ul.userl-links').hasClass('visuallyhidden')){
 ..
}
 else { }

フィドルを 作成する場合は、質問を編集してより適切に回答しaddClass()ますremoveClass()。toggleClass()

于 2013-05-10T10:22:08.800 に答える