2

私は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のすべての組み合わせを試しましたが、うまくいきませんでした。

4

1 に答える 1

1

私はそれを正確に突き止めることはできませんが、それはタイミングの問題であるように私には思えます。マウスをその上で非常に速く動かすと、メニュー項目がmouseoverイベントを取得し、メニューが展開されますが、メニューが展開される前に、少し遅れてmouseoutイベントを受け取り、折りたたむことになります。マウスが展開されたメニューの上にあるため、再びマウスオーバーを受け取ります（マウスを動かさなくても、マウスオーバー/アウトイベントがディスパッチされるのは奇妙に思えるので、これについてはあまりわかりません）。ブラウザは、移動するすべてのピクセルに対してではなく、数ミリ秒ごとにmousemoveイベントをディスパッチすることに注意してください。同様に、マウスオーバーイベントとアウトイベントは、実際に発生した正確なタイミングで必ずしもディスパッチされるとは限りません。イベント狂乱に関する私の仮定が正しければ、それはstop()シルドの前に、あなたはすでにそれを試したと言ったが。このようにして、スライドはマウスアウトですぐに収縮するはずです。

ここでjsFiddleを編集しました

于 2012-04-15T18:24:47.223 に答える