javascript - jQuery 动画剩余时间

Question

我试图通过增加左侧的位置来使 div 向右滑动，我希望它慢慢地从左侧移动到右侧，然后循环回到开头。目前我只是想为该位置设置动画，这样它就不会立即跳跃 -

$('#pig').css('left', 200).animate(300);

Answer 1

语法是

$('#pig').animate({left: 200}, 300);

jQuery.animate documentation

要在队列中添加动画，您可以将它们链接起来

$('#pig').animate({left: 200}, 300).animate({left: 0}, 300);

FIDDLE

或者使用回调参数，或者使用 jQuery 的队列在队列中设置任意数量的动画

$('#pig').queue(function() {
    $(this).animate({left: 200}, 300);
    $(this).animate({left: 0}, 300);
}).dequeue();

FIDDLE

或者要使其递归，您可以使用两者的组合

(function ani() {
    $('#pig').queue(function() {
        $(this).animate({left: 200}, 300);
        $(this).animate({left: 0}, 300, ani);
    }).dequeue();
}());

FIDDLE