0

私の脳は爆発するだろう..なぜこれが機能しないのですか？時間間隔でいくつかのdivをアニメーション化しようとし、より少ないコードを書き込もうとしていますが、これは機能しません

    var cargaCont = function(){
        o = 1;
        var animacion = function(i){
            $('#page2txt'+i).animate({
                height:'20'
            },200,function(){
                $('#page2img'+i).animate({
                    left:'0',
                    right:'0'
                },200,function(){
                    i++;
                    return i;
                });
            });
        }
        while(o < 3){
            setTimeout(function(){o = animacion(o);},200);
        }   
    }
4

2 に答える 2

1

このコードの問題：

while(o < 3){
    setTimeout(function(){o = animacion(o);},200);
}

によって遅延された関数setTimeoutが実行されるまでに、oすでに3であるため、すべての呼び出しanimacionは1と2ではなく3を渡します。

この問題を回避するにはo、即時関数を使用しての値を「ローカライズ」する必要があります。

while(o < 3){
    //o out here is from cargaCont
    (function(o){
        //override o by naming the passed variable o
        setTimeout(function(){
            o = animacion(o); //now o refers to the local o
        },200);
    }(o)); //execute inner function, passing in o
}

これにより、oの関数によって使用されるものが、関数のではなくローカル関数setTimeoutのにバインドされるようになります。oocargaCont

于 2012-07-19T07:31:58.123 に答える
0

正確に何をしようとしているのかは100％わかりませんが、基本的には次のようなアニメーションをループしたいと思います。

var cargaCont = function(){
    var i = 1,
        animacion = function(i){
            $('#page2txt'+i).animate({
               height:'20'
           },200,function(){
               $('#page2img'+i).animate({
                   left:'0',
                   right:'0'
               },200,function(){
                   if(i < 3){
                      animacion(++i);
                   }
               });
           });
       };
    animacion(i);
};

必要に応じて編集するか、マークアップを投稿してさらに説明します。

乾杯。

于 2012-07-19T08:20:06.247 に答える