jQuery animate 参数仅在添加 0 时有效？

Posted 2023-05-09

【中文标题】jQuery animate 参数仅在添加 0 时有效？

【英文标题】：jQuery animate parameter only works when adding 0?

【发布时间】：2013-08-07 04:48:52

【问题描述】：

以下是我在 swiperight 事件中编写的代码（它的作用就像向右滑动它会更改 div 中的图像）

$("#divimglstdetails").animate( marginRight: 280 ,0,100).animate( marginRight: 0 , 100);
      );

我很想知道animate( marginRight: 280 ,0,100) 中的 0 是什么意思..我猜 100 是 ms 中的持续时间..这里我的代码向右滑动在向右滑动时添加 0 时效果很好，它会闪烁并改变图片..

【问题讨论】：

我认为 0 被用作持续时间，而 100 被忽略。您应该使用 animate 的回调函数，因为这里的两个 animate 似乎都是一起播放的。您应该提供一个 jsfiddle 来重现您的问题。通过将第一个动画更改为 css() 进行测试，看看它是否具有相同的行为

但如果我一开始使用 100 而不是 0，图像转换就会像闪烁一样发生......

是的，因为两个动画是同时播放的。 Animate 使用了一些延迟/超时，使其像异步一样工作，这就是为什么你应该使用 first animate 的回调函数

【参考方案1】：

如果您希望在第一个动画之后发生第二个动画，则需要将其作为回调函数。另外，第一个数字应该是动画时间，然后你需要缓动。例如

$("#divimglstdetails").animate(marginRight: 280,1000,'swing',function()
  $(this).animate(marginRight: 0,1000,'swing');
);

【讨论】：

使用 1000 作为延迟将在 OP 显示他在调试目的中使用 100 看不到的内容，+1

是的，当很难看到过程是什么时，最好放慢动画速度。