9

jQuery UI ツールチップに事前遅延を追加する必要があります。私は最新バージョン (1.9) を使用しており、ヒントをホバーしてから 2 秒後に開くようにしたいと考えています。

以下を使用して、ヘッダーのヒントを呼び出しています。

<script>
    $(function() {
        $( document ).tooltip({ predelay:2000,});   
    });
</script>

しかし、彼らが解雇されたとき、彼らには何の遅れもありません...何か助けはありますか?

4

3 に答える 3

23

これを使って

$( "#elementid" ).tooltip({
  show: {
    effect: "slideDown",
    delay: 250
  }
});
于 2013-01-17T21:34:40.413 に答える
4

私は同じ問題を抱えていましたが、最終的にこの解決策を思いつきました：

var opendelay = 500;
var closedelay = 500;
var target = $('.selector');
target.tooltip({ /* ... */ });
target.off('mouseover mouseout');
target.on('mouseover', function(event) {
    event.stopImmediatePropagation();
    clearTimeout(target.data('closeTimeoutId'));
    target.data('openTimeoutId', setTimeout(function() { target.tooltip('open'); }, opendelay));
});
target.on('mouseout', function(event) {
    event.stopImmediatePropagation();
    clearTimeout(target.data('openTimeoutId'));
    target.data('closeTimeoutId', setTimeout(function() { target.tooltip('close'); }, closedelay));
});

基本的にそれが行うことは次のとおりです。

  • ツールチップのデフォルトの onMouseOver イベントを無効にする
  • setTimeout() を使用して遅延されるツールチップの新しい mouseOver イベントを追加します。
  • タイムアウトをキャンセルする新しい mouseOut イベントを追加します (これにより、遅延が経過する前にマウスがターゲット領域を離れた場合にツールチップが表示されなくなります)。
  • ボーナス：同じ手法を使用して、「opendelay」別名「predelay」に似た「closedelay」も追加します
  • event.stopImmediatePropagation();一部の場合にのみ必要です。例えば。ITをホバリングしている間（開いた後）、ツールチップ要素を表示したままにする場合。これが必要な場合は、ツールチップに同じホバー イベントを登録します。target.tooltip({ open: function (event, ui) { ui.tooltip.hover(..., ...); } });
  • ps や のように、これらの呼び出しをいくつか連鎖させることもできonますoff。
  • イベント関数内をまたはに置き換えることは可能かもしれません。しかし、よくわかりませんし、試したこともありません。結局うまくいかないかもしれません。targetthis$(this)
  • closeDelay が必要ない場合は、 or を含む行を削除して、closeTimeoutIdinclosedelayを削除mouseoutするtarget.off('mouseover mouseout');か、0 に設定します。
  • openDelay が必要ない場合も同様です...その逆です
于 2013-08-06T17:53:05.563 に答える
0

IE にはぶら下がっているコンマに関する問題があります。おそらくそれを削除して、それが役立つかどうかを確認してください。

$( document ).tooltip({ delay:2000 });
于 2013-01-17T21:33:22.317 に答える