jquery - jquery keydown 动画背景颜色

Question

我试图简单地在击键时为背景设置动画。我无法使用：

$('input#userInput').live('keydown', function() { 
    $(this).animate({backgroundColor:'#4E1402'}, 300).delay(800).animate({backgroundColor: '#555'}, 100);
});

请让我知道我哪里出错了。谢谢！

Answer 1

那是因为你不能在没有插件的情况下为背景颜色设置动画

所有动画属性都应动画为单个数值，除非以下说明；大多数非数字属性无法使用基本的 jQuery 功能进行动画处理（例如，宽度、高度或左侧可以进行动画处理，但背景颜色不能进行动画处理，除非使用 jQuery.Color() 插件）。除非另有说明，否则属性值被视为像素数。可以在适用的情况下指定单位 em 和 %。

jsFiddle 与插件

Answer 2

试试颜色插件，它“为 jQuery 1.2 和更新的版本添加了彩色动画的能力”。

此外，jQuery UI已经包含了彩色动画支持。

Answer 3

像这样试试

$('#userInput').keydown(function(){
  $(this).css("backgroundColor",'#4E1402');
$(this).delay(2000).queue(function(){
    $(this).css("backgroundColor",'#555');});
 });