jquery - jquery 动画之间的短暂延迟。为什么？

Question

$("#car_overtake5").animate({path : new $.path.arc(arc_params)}, {duration: 2000, queue: false});
$("#car_overtake5").animate({rotate: '109deg'}, {duration: 2000, queue: true});
$("#car_overtake5").animate({"left":"9872px","top":"4872px"}, {duration: 1000, queue: true});
$("#car_overtake5").animate({rotate: '94deg'}, {duration: 250, queue: true});
$("#car_overtake5").animate({"left":"10939px","top":"4948px"}, {duration: 1000, queue: true});

一辆汽车正在赛道上行驶。但是在每个动画之后它会停止一小段时间然后播放下一个。

我怎样才能让他们毫不拖延地流畅演奏？

编辑：将缓动改为线性，现在没有延迟。

Answer 1

默认缓动设置为“swing”，因此尝试将其更改为“linear”：

$("#car_overtake5")
     .animate({path : new $.path.arc(arc_params)}, {duration: 2000, queue: false, easing: "linear"})
     .animate({rotate: '109deg'}, {duration: 2000, queue: true, easing: "linear"})
     .animate({"left":"9872px","top":"4872px"}, {duration: 1000, queue: true, easing: "linear"})
     .animate({rotate: '94deg'}, {duration: 250, queue: true, easing: "linear"})
     .animate({"left":"10939px","top":"4948px"}, {duration: 1000, queue: true, easing: "linear"});

Answer 2

#car_overtake5jQuery每次都必须在 DOM 中查找。这会导致延迟，尤其是在您所说的“大型项目”中。用这个：

$("#car_overtake5").animate({path : new $.path.arc(arc_params)}, {duration: 2000, queue: false})
        .animate({rotate: '109deg'}, {duration: 2000, queue: true})
        .animate({"left":"9872px","top":"4872px"}, {duration: 1000, queue: true})
        .animate({rotate: '94deg'}, {duration: 250, queue: true})
        .animate({"left":"10939px","top":"4948px"}, {duration: 1000, queue: true});