循环动画javascript，SetInterval只工作一次答案

【问题标题】：loop animate javascript, SetInterval works only once循环动画javascript，SetInterval只工作一次
【发布时间】：2016-01-31 11:12:28
【问题描述】：

我正在使用 JavaScript 尝试为 div 设置动画。出于某种原因，我的 div 不会每 2 秒循环一次 400px，它只会移动一次。

JavaScript：

<script>
    function animate(name,dist,time) {
        $(name).animate({left:dist},time);
    }
    $(function() {
        setInterval(animate('.box1',400,800),2000);
    });
</script>

HTML：

<div class="box1"></div>

【问题讨论】：

标签： javascript jquery html jquery-animate

【解决方案1】：

试试这个

function animate(name,dist,time) {
    $(name).animate({left:dist},time);
}
$(function() {
    setInterval(
        function() {
            animate('.box1',"+=400",800)
        },
        2000
    );
});

你可以在这里测试：https://jsfiddle.net/CliffBurton/k03cyup1/（我用50px只是为了测试）

jQuery animate() 函数的属性可以是相对的。

如果提供的值带有前导的 += 或 -= 字符序列，则通过从属性的当前值加上或减去给定数字来计算目标值。

在这里你可以找到jQuery animate() function reference

【讨论】：

【解决方案2】：

window.setInterval(function () {
    animate('.box1',400,800);
}, 2000);

【讨论】：

它仍然播放它...我为我的盒子使用了“相对”位置