简体   繁体   English

我怎样才能使这个更好的递归动画jQuery脚本?

[英]How can I make this a better recursive animated jQuery script?

The idea is to animate a cloud div and to have it animate back and forth horizontally in perpetuity. 这个想法是为一个云div设置动画,让它永久地水平来回动画。 This works, but unfortunately I think it's prone to memory leaks and UI lag. 这很有效,但不幸的是我认为它容易出现内存泄漏和UI滞后。 Any advice would be appreciate, thanks. 任何建议都会很感激,谢谢。

function animateCloud() {
    $('#cloud').animate({ right: '+=500' }, { duration: 35000, easing: "linear", queue: true });
    animateOpposite();
}

function animateOpposite() {
    $('#cloud').animate({ right: '-=500' }, { duration: 35000, easing: "linear", queue: true });
    animateCloud();
}

$(document).ready(function() {
    animateCloud();
});

I don't think that your code leaks memory at all, but you can create the call shorter. 我认为您的代码根本不会泄漏内存,但您可以更短地创建调用。

function animateCloud() {
    $('#cloud').animate({ right: '+=500' }, { duration: 35000, easing: "linear" })
               .animate({ right: '-=500' }, { duration: 35000, easing: "linear", complete: animateCloud });
}

example: http://www.jsfiddle.net/bh3f4/ 例如: http//www.jsfiddle.net/bh3f4/

http://api.jquery.com/animate/ http://api.jquery.com/animate/

Use the optional callback argument. 使用可选的回调参数。 When an animation finishes, jquery will call your function. 动画结束后,jquery会调用你的函数。 Perfect time to animate other direction. 完美的时间来动画其他方向。

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM