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

loop animate javascript, SetInterval works only once

本文关键字：一次 工作 动画 javascript SetInterval 循环      更新时间：2023-09-26

我正在使用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>

试试这个

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()函数参考

window.setInterval(function () {
    animate('.box1',400,800);
}, 2000);
相关文章：