如何在 jQuery 中永久运行 .animate 函数？

发布于 2024-07-29 20:54:29 字数 356 浏览 5 评论 0原文

$(this).css("left","100px");

function endless(){
    $(this).animate({
        left:'-=100px',
    },{
        easing: "linear",
    duration: 5000,
    complete: function() {
        $(this).css('left','100px');
    endless();
        }
    });
};
endless();

这就是我尝试过的，但是使用这种方法我无法让东西移动。我正在使用 jQuery 1.3.2。有什么建议么？

原文

$(this).css("left","100px");

function endless(){
    $(this).animate({
        left:'-=100px',
    },{
        easing: "linear",
    duration: 5000,
    complete: function() {
        $(this).css('left','100px');
    endless();
        }
    });
};
endless();

This is what I tried, but using this approach i can't get stuff moving.
Im' using jQuery 1.3.2.
Any Suggestions?

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

淡紫姑娘！ 2024-08-05 20:54:29

伟大的！这正是我所寻找的，但现在，

我终于找到了如何切换它。使用以下函数，调用endless(0) 停止动画循环，调用endless(1) 启用动画循环。

//loop animation forever
//args: takes 1 to loop, 0 to stop
function endless(loop)
{ 
  //animate forever
  if (loop==1)
  {
 $('#alink').animate(
  {'opacity':'toggle'}, 
  1000, 
   function () { endless(1) }
  ); 
  }
  //stop animation
  else
  {
 $('#alink').css('opacity',1).stop();
  }

}; 


//sample call
$('#alink').toggle(function(){ endless(1) },function(){ endless(0) });

感谢初始代码！

Great! this is exactly what i searched for, but now,

i finally figured how to toggle it. with the following function, call endless(0) to stop, and endless(1) to enable animation loop.

//loop animation forever
//args: takes 1 to loop, 0 to stop
function endless(loop)
{ 
  //animate forever
  if (loop==1)
  {
 $('#alink').animate(
  {'opacity':'toggle'}, 
  1000, 
   function () { endless(1) }
  ); 
  }
  //stop animation
  else
  {
 $('#alink').css('opacity',1).stop();
  }

}; 


//sample call
$('#alink').toggle(function(){ endless(1) },function(){ endless(0) });

thanx for initial code!

回复收藏 0 原文

汐鸠 2024-08-05 20:54:29

您的动画参数错误。它不需要选项哈希，只需要缓动、持续时间和回调的实际选项。另外，使用 this 时需要小心。最好将其作为参数传递给无限函数。

$(this).css("left","100px");

function endless(elem){
    $(elem).animate(
        { left:'-=100px' },
        "linear",
        5000,
        function() {
            $(elem).css('left','100px');
            endless(elem);
        }
     );
};
endless(this);

You have the parameters to animate wrong. It doesn't take an options hash, just the actual options for easing, duration, and a callback. Also, you need to take care when using this. Better to pass it in as an argument to the endless function.

$(this).css("left","100px");

function endless(elem){
    $(elem).animate(
        { left:'-=100px' },
        "linear",
        5000,
        function() {
            $(elem).css('left','100px');
            endless(elem);
        }
     );
};
endless(this);

回复收藏 0 原文

我乃一代侩神 2024-08-05 20:54:29

您需要从回调中调用 Endless() 。

function endless(item) {
  $(item).animate({"left": "-=100px"}, 5000, "linear", function(){
    $(item).css("left","100px");
    endless(item);
  });
}

endless($(".myBox"));

You'll need to call endless() from within a callback.

function endless(item) {
  $(item).animate({"left": "-=100px"}, 5000, "linear", function(){
    $(item).css("left","100px");
    endless(item);
  });
}

endless($(".myBox"));

回复收藏 0 原文