奇妙な効果/ちらつき（）ロールオーバーメニュー

Question

に私はjQueryのロールオーバーメニューでこのサイトを作りました：

http://www.ffsolar.com/index.php?lang=EN&page=home

それがうまく機能していないことが起こります。 「サービス」ボタンの上の白いスペースからマウスを画像の中央まですばやく移動してください。ストラッジ効果が発生すると、メニューが "ちらつき"始まり、マウスを動かすまで停止しません。

まあ、これは私のjQueryのコードです：これが起こると私はそれについて何を行うことができる理由

$('#main_navi li').hover(
     function() { 
      //show its submenu 
      $('ul', this).stop(true,true).slideDown(200); 
     }, 
     function() { 
      //hide its submenu 
      $('ul', this).stop(true,true).slideUp(200); 
     } 
    ); 

誰かが私に説明できますか？私はstop（）でtrueとfalseのすべての組み合わせを試しましたが、うまくいきませんでした。

Answer 1

私はそれを本当に釘付けにすることはできませんが、タイミングの問題であると私には分かります。マウスを実際に速く動かすと、メニュー項目がmouseoverイベントを取得し、メニューが展開されますが、メニューが展開される前に少し後にmouseoutイベントが受信され、折りたたまれますマウスが拡大されたメニューの上にあるので、もう一度マウスオーバーを受け取ります（マウスが動かなくてもマウスオーバー/アウトイベントが送出されるというのは奇妙に思えるので、これは本当に面白いわけではありません）。 ブラウザは移動するすべてのピクセルではなく、数ミリ秒ごとにmousemoveイベントを送出することに注意してください。同様に、mouseoverイベントとoutイベントは、実際に発生した時に必ず送出されるわけではありません。イベントの狂気に関する私の前提が正しいならば、silidesの前にstop()で解決できるはずですが、あなたはすでにそれを試みたと言います。このようにして、スライドはマウスアウト時に直ちに後退するはずです。

編集は、あなたの答えのためのjsFiddle here