实际上,我有一个解决方案,只需要jQuery 1.3x版本,不需要任何额外的插件。
首先,在您的脚本中添加以下功能:
function easeInOut(minValue,maxValue,totalSteps,actualStep,powr) {
var delta = maxValue - minValue;
var stepp = minValue+(Math.pow(((1 / totalSteps)*actualStep),powr)*delta);
return Math.ceil(stepp)
}
function doBGFade(elem,startRGB,endRGB,finalColor,steps,intervals,powr) {
if (elem.bgFadeInt) window.clearInterval(elem.bgFadeInt);
var actStep = 0;
elem.bgFadeInt = window.setInterval(
function() {
elem.css("backgroundColor", "rgb("+
easeInOut(startRGB[0],endRGB[0],steps,actStep,powr)+","+
easeInOut(startRGB[1],endRGB[1],steps,actStep,powr)+","+
easeInOut(startRGB[2],endRGB[2],steps,actStep,powr)+")"
);
actStep++;
if (actStep > steps) {
elem.css("backgroundColor", finalColor);
window.clearInterval(elem.bgFadeInt);
}
}
,intervals)
}
接下来,使用以下方式调用该函数:
doBGFade( $(selector),[245,255,159],[255,255,255],'transparent',75,20,4 );
我会让你猜测参数,它们非常容易理解。老实说,这个脚本不是我写的,我从一个网页上拿来的,然后修改了一下,使其能够与最新的jQuery兼容。
注意:在Firefox 3和IE 6上测试过(是的,在那个古老的东西上也能运行)