7

hoverintent プラグインは、私が必要としているものとは正反対です。.trigger によってトリガーされる .popup があります。ホバーすると、.popup が数秒間フェードアウトしないようにしたいのですが、ホバーしてから再度ホバーすると、発生するフェードアウトがキャンセルされます。 .popupを開いたままにします。

誰も私がこれを行う方法を知っていますか?

これは機能しませんが、アイデアでした：

 $('.trigger').hover(function(){
        $('.popup').fadeIn(600)
    }, function() {
        $('.popup').delay(2000, function(){
            if ($(this).blur() = true) {
                $('.popup').fadeOut(600)
            }
        });
    })
4

4 に答える 4

12

jQuery HoverIntent プラグインはまさにあなたが探しているものです。

timeout プロパティは、out 関数が呼び出される前にマウスが領域の外に出る必要がある時間を設定します。

ホバー インテント Web サイトからの引用:

timeout: 「out」関数が呼び出されるまでのミリ秒単位の単純な遅延。タイムアウトになる前にユーザーが要素の上にマウスを戻した場合、"out" 関数は呼び出されません (また、"over" 関数も呼び出されません)。これは主に、ユーザーをターゲット要素から一時的に (そして意図せずに) 離すずさんな/人間のマウスの軌跡から保護するためです... ユーザーに戻る時間を与えます。デフォルトのタイムアウト: 0

設定するには...

$('.trigger').hoverIntent({
     over: startHover,
     out: endHover,
     timeout: 2000
});

次に、処理する関数を定義しover、out

 function startHover(e){
    //your logic here
    $('.popup').fadeIn(600)
 }

 function endHover(){
     //your logic here
     $('.popup').fadeOut(600)
 }

編集：

プロパティを調整しintervalて、startHover 関数が起動する時間を増減することもできます...デフォルトは 100 ミリ秒に設定されています...マウスが入るとすぐにポップアップを起動するようにゼロに設定できます必要に応じてトリガー領域。

于 2011-01-28T17:19:55.407 に答える
3

追加のプラグインなしで、これを行う最も簡単な方法は次のとおりです。

$('.trigger').hover(function() {
    clearTimeout(this.timer);
    $('.popup').fadeIn(600);
}, function() {
    this.timer = setTimeout(function() { 
        if ($(this).blur() = true) { // off topic: you should to check this condition ;)
            $('.popup').fadeOut(600);
        }
    }, 2000);
});

setTimeout() と clearTimeout() は、HTML DOM Window オブジェクトのネイティブ JS 関数であり、昔からあります。

于 2013-12-25T19:57:25.687 に答える
1

jquery hoverintent プラグインを使用してみてください。

于 2011-01-28T17:17:45.350 に答える
-1

これは私のために働く：

$(".triger").mouseenter(function() {
    $(this).find("popup").fadeIn();
}).mouseleave(function() {
    $(this).find("popup").delay(200).fadeOut();
});
于 2012-10-26T07:52:21.583 に答える