jquery - jquery中bg颜色之间的淡入淡出？

Question

我有一个 div，我需要在其中重复更改 4 种不同的颜色。因此，每隔 5 秒，它就会褪色到“在线”的下一个颜色，当所有 4 种颜色都显示出来时，它会重新开始。

我该怎么做？

Answer 1

您可以将颜色数组、模运算符和 setTimeout 方法与 JQuery UI 中可用的颜色动画结合使用：

var colors = ["red", "orange", "yellow", "green", "blue"]
var i = 0;

$("#myDiv").css("background-color","red");

function changeColor()
{
    i++;
    i=i%5;
    $("#myDiv").animate({backgroundColor: colors[i]},1000);
    setTimeout(changeColor,2500);
}

changeColor();

小提琴样本：http: //jsfiddle.net/johnkoer/8GGFM/26/