如何在 jQuery 中同时运行两个动画？

在 jQuery 中，我们可以使用 animate() 函数来实现动画效果，但是如果我们想要同时运行两个动画，该怎么办呢？本文将介绍两种方法来实现同时运行两个动画。

方法一：使用队列

jQuery 中有一个函数叫做 queue()，可以用于处理动画队列。我们可以通过将两个动画放入队列中，来实现同时运行两个动画的效果。示例代码如下：

$("div").queue(function() {
  $(this).animate({left: '100px'}, 1000);
  $(this).dequeue();
});

$("div").queue(function() {
  $(this).animate({top: '100px'}, 1000);
  $(this).dequeue();
});

上面的代码中，我们首先将一个动画放入队列中，然后在队列执行完毕后，再将另一个动画放入队列中。这样就可以实现同时运行两个动画的效果了。

方法二：使用回调函数

除了使用队列，我们还可以使用回调函数的方式来实现同时运行两个动画。示例代码如下：

$("div").animate({left: '100px'}, 1000, function() {
  $("div").animate({top: '100px'}, 1000);
});

上面的代码中，我们在第一个动画执行完毕后，调用了回调函数来执行第二个动画。这样就可以实现同时运行两个动画的效果了。

总结

以上就是在 jQuery 中同时运行两个动画的两种方法。使用队列或者回调函数都可以实现这个效果，具体使用哪种方法可以根据自己的需求来选择。