使用队列函数的JQuery缓动

时间:2012-01-26 17:36:23

标签: jquery jquery-animate easing

以下缓动不会触发。如果删除了queue:true,它也会这样做,但我们也需要这一点。

$(this).delay(delay).animate({left: '+' + bounceoffset + 'px', top:0, opacity:0.6}, {queue:true, duration:800}, 'elastic');

如何完成。

1 个答案:

答案 0 :(得分:-1)

documentation并未说明指定queue: true表示queue: 'fx'是默认队列。

默认排队,所以只需删除queue: true

编辑您实际上没有使用正确的格式,即

  • .animate( properties [, duration] [, easing] [, complete] )
  • 或:.animate( properties, options )

在您的情况下,将{queue:true, duration:800}更改为800

RTFM。

再次编辑

您认为您正在使用第一个参数结构,但实际上您正在使用第二个参数结构。 JQuery将对象视为第二个参数,并认为它是第二个参数。

我认为真正的问题是“弹性”并不是真正的缓和功能。因此,如果 JQuery忽略了你的代码工作的最后一个参数(认为只有两个),但如果你将{queue:true, duration:800}更改为800,JQuery会假定第一个参数结构并失败,因为你指定的缓动是未定义的。

顺便说一句。这些是JQuery中定义的缓动:

线性摆动jswing DEF easeInQuad easeOutQuad easeInOutQuad easeInCubic easeOutCubic easeInOutCubic easeInQuart easeOutQuart easeInOutQuart easeInQuint easeOutQuint easeInOutQuint easeInSine easeOutSine easeInOutSine easeInExpo easeOutExpo easeInOutExpo easeInCirc easeOutCirc easeInOutCirc easeInElastic easeOutElastic easeInOutElastic easeInBack easeOutBack easeInOutBack easeInBounce easeOutBounce easeInOutBounce