CODEWITHSUNDEEP
javascriptjquerycss
Arnthor
Arnthor

Reputation: 2623

jQuery animate not working at all

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/

Upvotes: 0

Views: 56

Answers (3)

Adil Shaikh
Adil Shaikh

Reputation: 44740

You need to have jQuery UI included to make you background-color animation to work

Demo --> http://jsfiddle.net/hzdcM/1/

Upvotes: 1

Starx
Starx

Reputation: 78971

.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);

Upvotes: 1

Alex
Alex

Reputation: 10216

Because jQuery cannot animate colors by itself, search a jQuery plugin for that

Upvotes: 1

Related Questions