反复动画一个div上下

Question

我想有一个使用jquery重复上下移动的div.换句话说,div从某个位置的顶部开始,向下移动,然后向上移动并重复此操作,从上到下大约1秒的间隔,然后返回到顶部.有slideUp和slideDown以及动画方法,但我不知道如何实现这一点,因为它需要在无限循环中,在javascript中你必须避免这样的循环.

Answer 1

jQuery的动画逻辑可以安全地使用回调调用或链接在一起而不使用setTimeout/setInterval:

像这样的东西应该对你有用

演示

function loop() {
    $('.bouncer').animate({'top': '500'}, {
        duration: 1000, 
        complete: function() {
            $('.bouncer').animate({top: 0}, {
                duration: 1000, 
                complete: loop});
        }});
}
loop();