2017-01-21 2 views
1

ツールチップを表示してタイムアウトをクリアするのに問題があります。私はそれがどのように機能するのか理解していると信じていますが、何らかの理由でここではうまくいきません機能外部ホバーjqueryのクリアタイムアウト

$('.div').hover(
    function(){ var t = setTimeout(function() { 
       $('.tooltip').show(500); 
       }, 500);}, 
    function(){ clearTimeout(t); 
       $('.tooltip').hide(300); 
}); 

答えて

0

移動変数の宣言は、そうでなければtが第二のコールバック内にアクセスすることはできません両方のコールバック内の変数のスコープを取得します。現在実行中のアニメーションを停止したい場合は、stop()メソッドを使用します。

var t; 
$('.div').hover(function() { 
    t = setTimeout(function() { 
    $('.tooltip').show(500); 
    }, 500); 
}, function() { 
    clearTimeout(t); 
    $('.tooltip').stop().hide(300); 
}); 

やアニメーションキュー間の遅延を提供するために、delay()メソッドを使用します。

$('.div').hover(function() { 
    $('.tooltip').delay(500).show(500); 
}, function() { 
    clearTimeout(t); 
    $('.tooltip').stop().hide(300); 
});