1

だから私は私のウェブサイトのためにこの滑らかな色のフェードトランジションを作ろうとしています. まさにそれを行う関数を作成しましたが、機能するように見えますが、少なくとも理解できない問題があり、以前にそのようなものを見たこともありません. 関数で再帰を使用し、変更した色を関数に戻して再度変更します。現在の色がターゲットの色と一致する場合にのみ終了します。私が完全に確認したことは、2つの配列を関数に再度渡すと、それらが分割されることです。

例: 通過前、startColsAr=[211, 211, 211]。通過後、startColsAr=['2'; '1'; '1'; '、'; '2'; '1'; '1'; '、'; '2'; '1'; '1'].(読みやすくするためにセミコロンを使用しました)。

以下の関数でわかるように、そのような配列の内容を変更するために何もしていません。これが私の機能です：

function transitionOut(startColAr,endColAr, waitTime, interval, page){      
        //change the colors
        for(var i=0;i<3;i++){
            if(startColAr[i]<endColAr[i]){
                startColAr[i]+=interval;

                if(startColAr[i]>endColAr[i]){startColAr[i]=endColAr[i];}

            }else if(startColAr[i]>endColAr[i]){
                startColAr[i]-=interval;

                if(startColAr[i]<endColAr[i]){startColAr[i]=endColAr[i];}
            }
        }

        //var color="rgb("+startColAr[0]+", "+startColAr[1]+", "+startColAr[2]+")";
        var color = "#"+startColAr[0].toString(16)+startColAr[1].toString(16)+startColAr[2].toString(16);
        document.body.style.backgroundColor = color;

        if(startColAr[0]==endColAr[0] && startColAr[1]==endColAr[1] && startColAr[2]==endColAr[2]){
            location.href=page;
        }

        window.setTimeout("transitionOut(\'"+startColAr+"\', \'"+endColAr+"\', \'"+delay+"\', \'"+interval+"\', \'"+page+"\')",waitTime);
    }

今、私は両方の配列に 3 つの値を渡すだけなので、2 つの配列を 6 つの整数パラメーターに簡単に変更できます (そしておそらく関数を機能させることができます (だから、トランジション用の新しいライブラリをダウンロードするように言わないでください、これはIS ABOUT ARRAYS))、しかし、なぜこれが起こっているのか知りたいです。誰か提案はありますか？絞り込むためにさまざまなことを試しましたが、これにへこみを入れることはできません。少しの援助？

4

2 に答える 2

0

この行はあなたの問題だと思います

window.setTimeout("transitionOut(\'"+startColAr+"\', \'"+endColAr+"\', \'"+delay+"\', \'"+interval+"\', \'"+page+"\')",waitTime);

あなたはおそらく次のようなものが欲しい

window.setTimeout(transitionOut, waitTime, startColAr, endColAr, waitTime, interval,page,waitTime);

文字列リテラルで setTimeout を呼び出すことはできますが、お勧めしません。

于 2012-06-22T16:31:05.437 に答える