jquery - jQuery タイマー: x でイベントを開始し、y で終了する

Question

次のことができるタイマーまたは jQuery の関数 (またはプラグイン!) を探しています: 「25 秒でボタン x を表示し、45 秒でボタン y を表示し、55 で x の表示を停止し65 で、y の表示を停止します」。

それはかなり単純に思えますが、私は空っぽになり続けています。イベントをディスパッチするが、それを終了または非表示にしない多くのタイマーを見つけました。

Answer 1

If you don't mind calculating the interval between events yourself:

$('#x').delay(25000).show().delay(30000).hide();
$('#y').delay(45000).show().delay(20000).hide();

alternatively, here's a plugin I just knocked up:

(function($) {
    var t0 = null;

    $.fn.timerAt = function(t) {
        var self = this;
        return this.queue(function(next) {
            var t1 = Date.now();
            var delay = Math.max(0, t0 + t - t1);
            setTimeout(next, delay);
        });
    };

    $.timerReset = function() {
        t0 = Date.now(); // use a shim on older browsers
    };

    $.timerReset();

})(jQuery);

$('#x').timerAt(25000).hide('slow').timerAt(55000).show('fast');
$('#y').timerAt(45000).hide('slow').timerAt(65000).show('fast');​

Answer 2

試す

setTimeout(function() { /* code to show x */ }, 25000);
setTimeout(function() { /* code to show y */ }, 45000);
setTimeout(function() { /* code to hide x */ }, 55000);
setTimeout(function() { /* code to hide y */ }, 65000);