要素がフェードアウトするのを止めるには？

Question

数秒後に表示されるツールチップが消えます。

function tooltip(msg) { 
    tooltipStart(msg); 
    tooltipExit(); 
} 

function tooltipStart(msg) { 
    $('body').append('<div id="tooltip">'+msg+'</div>'); 
    $('#tooltip').fadeIn(300); 
} 

function tooltipExit(duration) { 
    if (! duration) { 
     duration = 2000; 
    } 

    $('#tooltip').delay(duration).fadeOut(1000, function() { 
     $('#tooltip').remove(); 
    }); 
} 

私は今、ツールチップがフェードアウトし、ユーザーがツールチップの上に置いた場合、100％不透明ではないにしたいです。

ツールヒントの動作方法を書き直す必要がありますか、またはマウスが上に移動したときにtooltipExit機能を停止する方法がありますか？

Answer 1

Thisトリックを行う必要があります！

function tooltipExit(duration) { 
    $('#tooltip').delay(duration||2000).fadeOut(1000, function() { 
     $(this).remove(); 
    }).hover(function() { 
     $(this).stop().show().fadeTo(0, 100); 
    }, function(){ 
     tooltipExit(); 
    }); 
} 

stop機能は、アニメーションを停止し、show関数が再びツールヒントが表示されます。マウスがツールチップを再び離れると、2秒後に再び消えるようになります。