jQuery animate not working at all
Nordvind’s Question:
I want to set a background-color div property on DOM ready, then perform some animation, like this: $("#test").css('background-color','red').animate({ 'background-color' : '#FFF'}, 500);
. Div looks like this <div id="test">11</div>
, and it has a background-color property set in CSS file #test{
background-color:#FFF;
}
Now the question – why animation is not working? You can see the code here – http://jsfiddle.net/hzdcM/
You need to have jQuery UI included to make you background-color animation to work
Demo -->
http://jsfiddle.net/hzdcM/1/
.animate()
function does not support animating colors. Use jQuery color plugin. or you can use jQuery UI Library.
UI Library is very heavy for just the color use.
Also you have use backgroundColor
not background-color
to animate the color properly.
$("#test")
.css('backgroundColor','red')
.animate({ 'backgroundColor' : '#FFF'}, 500);