Jquery动画循环多次

Question

我的代码存在循环问题：

<p style="position:relative;left:100px;opacity:0" class="bc1">hello</p>

我想用jquery将动画三循环循环到：

1. $('.bc1').animate({left: '0px',opacity:'1'},1000);
2. 延迟10秒
3. $('.bc1').animate({left: '100px',opacity:'0'},1000);
4. 延迟1秒
5. 然后从1
重新开始

我可以让它无限吗？

我试过了：

var st=animateBac();
        var af=animateRev();
        st();           
        af();

但它没有循环。

Answer 1

试试这个：

var animationIsOn = true;
var anim;
anim = function(){
    $('.bc1').animate({left: '0px',opacity:'1'},1000);
    setTimeout(function(){
        $('.bc1').animate({left: '100px',opacity:'0'},1000);
        setTimeout(function(){
            if(animationIsOn){
                anim();
            }
        },1000);
    },10000);
}

编辑：对不起，没有添加延迟。