3

divマウスが上に来るたびに小さなアニメーションを実行するこれがあります：

$('.cg-panel').bind('mouseover.anim', function() {
    $(this).stop(true).css({ 'opacity': 0.4 }).transition({ 'opacity': 0 }, 800);
});

問題は、必要に応じて表示および非表示になっている.cg-panel別の上にあるdivことです。

$('#control_grid').show();

「コントロール グリッド」が表示されると、マウスオーバー イベントがすぐに発生します。マウスがすでにその上にある場合は、マウスが横から入ったときにのみ発火させたくありません。

その最初のイベントを発生させないようにするにはどうすればよいですか?

フィドルの例- クロムで試してください。何らかの理由でFirefoxがロックされていますが、理由はわかりません。

イベントが表示された後もイベントをバインドできません

4

2 に答える 2

0

「コントロール グリッド」は onclick イベント内に表示されます。同時に変数を設定すると、

$cg.show().data('flash', false);

次に、それを使用して最初の「フラッシュ」を防ぐことができます。

$('.cg-panel').on('mouseenter.anim', function() {
    if($cg.data('flash')) {
        $(this).stop(true).css({ 'opacity': 0.4 }).transition({ 'opacity': 0 }, 800);
    } else {
        $cg.data('flash', true);
    }
});

これは、グリッドが画面全体をカバーしているためにのみ機能するため、パネルが表示されたときにマウスがパネルの 1 つを超えないようにすることは不可能です。(おそらくキーボードイベントを追加しない限り...これは計画です...しかし、私にはより良い解決策がありません)

于 2012-09-08T21:41:00.547 に答える