.css().animate()不工作了吗？

Question

我想用下面的代码高亮显示一个元素：

$('input.step:last').css('background','#003').animate({'background':'#fff'},300);

但它不起作用。

http://jsfiddle.net/Cpwmm/

为什么？

Answer 1

您需要JQuery.Color插件(jquery-ui的一部分)。那就这么做，

$(document).ready(function(){
     $('input.step:last')
     .css({'backgroundColor':'#003'})
    .animate({'backgroundColor':'#fff'},300);
})​

Answer 2

要为颜色添加动画效果，您需要添加jQuery动画颜色插件。

http://www.bitstorm.org/jquery/color-animation/

然后，您应该使用：

$('input.step:last').css('background-color','#003')
                    .animate({'background-color':'#fff'},300);

注意不同之处，你应该动画“背景颜色”属性，而不是“背景”属性。

http://jsfiddle.net/Cpwmm/7/

Answer 3

默认情况下，为jQuery can’t animate colors。您可以使用jQuery.color() plugin, found here,来赋予它这种能力。