2

基本的に、x秒後にマウスオーバーイベントがトリガーされない場合、要素をフェードアウトしたいと考えています。数時間試してみましたが、正しく動作するコードを書くことができないようです。

これまで私は書いてきました -

$('.toolTip').live('mouseover', function() {
    $(this).stop(true, true).fadeIn();
});
$('.toolTip').live('mouseleave', function() {
    $(this).delay(4000).fadeOut("slow");
});

マウスがdivに入ってから離れると機能しますが、フォーカスが得られない場合は機能しません。

4

2 に答える 2

5

mouseover.toolTip divでイベントが呼び出されることはありません。これは、要素にfadeOut()適用することで終了するため、二度とマウスを操作する必要がないためです。display:noneおよびfadeOut（）の代わりに、fadeTo（）を使用して、表示プロパティに影響を与えることなく不透明度を変更できます。

$(document).on('mouseover', '.toolTip', function() {
    $(this).stop().fadeTo("fast", 1);
});

$(document).on('mouseleave', '.toolTip', function() {
    $(this).delay(4000).fadeTo("slow", 0);
});​
于 2012-08-10T02:48:42.573 に答える
3

これを実現する 1 つの方法はfadeTo()、マウスオーバー イベントに加えてコマンドを追加して、最初にフェード アウトを開始するようにすることです。

$(".toolTip").delay(1000).fadeTo(5000, 0);
$(".toolTip").on({
    mouseleave: function() {
        $(this).delay(1000).fadeTo(5000, 0);
    },
    mouseenter: function() {
        $(this).stop().fadeTo(500, 1);
    }
});

デモ

于 2012-08-10T03:05:45.413 に答える