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 个整数参数（并且可能让函数工作（所以不要告诉我去下载一个新的转换库，这个是关于阵列）），但我想知道为什么会这样。有没有人有什么建议？我尝试了很多不同的方法来缩小范围，但我似乎根本无法解决这个问题。一点帮助？

4

2 回答 2

0

问题出在这条线上：

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

当您准备稍后运行的代码时，您正在将数组转换为字符串。根据Mozilla doc，使用 setTimeout 函数的替代形式可能会更容易：

window.setTimeout(transitionOut, waitTime, startColAr, endColAr, waitTime, interval, page);
于 2012-06-22T16:29:26.597 回答
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 回答