jquery - 如何在jQuery上循环动画

Question

我只是想知道如何循环我的动画（1 个水平移动的矩形）。另外，如何在页面完全加载后使动画发生，而不是像我目前的编码所示那样通过单击按钮来启动动画。抱歉，我是 jQuery 新手，刚刚习惯了基础知识。谢谢你的帮助！

$(document).ready(function(){
  $("button").click(function(){
    $("#div2").animate({right:'1000px'}, 7000);
  });
});

HTML

<div id="div2" style="background:#e1e1e0;opacity:0.4;height:100px;width:500px;position:absolute;"></div>

score 1 · Accepted Answer

将其放入一个函数中，然后让该animate()方法在其回调参数中调用该函数：

function animateRect(){
    $("#div2").css({right:0}).animate({right:'1000px'}, 7000, animateRect);
}

我已经css()在其中添加了一个方法来重置元素的正确位置，否则只会有 1 个动画。

score 0 · Accepted Answer

如果我理解正确，您只需要删除点击处理程序，如下所示：

$(document).ready(function(){
   $("#div2").animate({right:'1000px'}, 7000);
});

这样动画将自行启动，无需单击

2 回答 2