ColorBlend插件完全是你想要的

http://plugins.jquery.com/project/colorBlend

这里是我的高亮代码

$("#container").colorBlend([{
    colorList:["white",  "yellow"], 
    param:"background-color",
    cycles: 1,
    duration: 500
}]);

使用CSS3-Transitions。支持很棒(所有现代浏览器，甚至IE)。使用Compass和SASS可以很快完成:

#foo {background:red; @include transition(background 1s)}
#foo:hover {background:yellow}

纯CSS:

#foo {
background:red;
-webkit-transition:background 1s;
-moz-transition:background 1s;
-o-transition:background 1s;
transition:background 1s
}
#foo:hover {background:yellow}

我写了一篇关于这个主题的德语文章:http://www.solife.cc/blog/animation-farben-css3-transition.html

ColorBlend插件完全是你想要的

http://plugins.jquery.com/project/colorBlend

这里是我的高亮代码

$("#container").colorBlend([{
    colorList:["white",  "yellow"], 
    param:"background-color",
    cycles: 1,
    duration: 500
}]);

简单地添加以下片段下面的jquery脚本和享受:

<script src="https://cdn.jsdelivr.net/jquery.color-animation/1/mainfile"></script>

参见示例

更多信息参考

你可以使用2个div:

你可以在上面放一个复制品，然后在把复制品淡入的同时把原来的淡出。

当淡出完成后，用新的bg恢复原始。

$(function(){
    var $mytd = $('#mytd'), $elie = $mytd.clone(), os = $mytd.offset();

      // Create clone w other bg and position it on original
    $elie.toggleClass("class1, class2").appendTo("body")
         .offset({top: os.top, left: os.left}).hide();

    $mytd.mouseover(function() {            
          // Fade original
        $mytd.fadeOut(3000, function() {
            $mytd.toggleClass("class1, class2").show();
            $elie.toggleClass("class1, class2").hide();            
        });
          // Show clone at same time
        $elie.fadeIn(3000);
    });
});​

jsFiddle例子

.toggleClass（） .offset（） .fadeIn（） .淡出（）

试试这个:

(function($) {  

            var i = 0;  

            var someBackground = $(".someBackground");  
            var someColors = [ "yellow", "red", "blue", "pink" ];  


            someBackground.css('backgroundColor', someColors[0]);  

            window.setInterval(function() {  
                i = i == someColors.length ? 0 : i;  
                someBackground.animate({backgroundColor: someColors[i]}, 3000);  
                i++;  
            }, 30);  

})(jQuery);  

你可以在这里预览示例:http://jquerydemo.com/demo/jquery-animate-background-color.aspx