jquery - jQuery Timer：在 x 开始一个事件并在 y 结束它

Question

我正在 jQuery（或插件！）中寻找计时器或函数，它允许我执行以下操作：“在 25 秒时，显示按钮 x，在 45 秒时显示按钮 y，在 55 时，停止显示 x，在 65 岁时，停止显示 y"。

看起来很简单，但我一直空着。我发现很多定时器会分派一个事件，但不会结束或隐藏它。

Answer 1

尝试

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);

Answer 2

如果您不介意自己计算事件之间的间隔：

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

或者，这是我刚刚敲出的一个插件：

(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');​