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

javascript jquery animation

2022-08-30 01:05:48

是否可以同时在两个不同的元素上运行两个动画？我需要与这个问题相反的Jquery排队动画。

我需要做这样的事情...

$('#first').animate({ width: 200 }, 200);
$('#second').animate({ width: 600 }, 200);

但同时运行这两者。我唯一能想到的就是为每个动画使用一次，但我不认为这是最好的解决方案。setTimeout

答案 1

是的，有！

$(function () {
    $("#first").animate({
       width: '200px'
    }, { duration: 200, queue: false });

    $("#second").animate({
       width: '600px'
    }, { duration: 200, queue: false });
});

答案 2

这将同时运行是的。如果要同时对同一元素运行两个动画，该怎么办？

$(function () {
    $('#first').animate({ width: '200px' }, 200);
    $('#first').animate({ marginTop: '50px' }, 200);
});

这最终会对动画进行排队。要同时运行它们，您只能使用一行。

$(function () {
    $('#first').animate({ width: '200px', marginTop:'50px' }, 200);
});

有没有其他方法可以同时在同一元素上运行两个不同的动画？