JQuery - background color fade out animation doesn't work

Question

I have th following script

 $("button#submit").click(function () {
 $("tr[data-id='" + lastRefId + "']").css("background-color", "#8aabf0");
 $("tr[data-id='" + lastRefId + "']").animate({ backgroundColor: "white"}, 'slow');
});

It's a simple script that should change the backgrund to the color above and than change it back to the previous color (white). The first line works, but the second doesn't.

Why and how should I fix it?

From the doc: For example, width, height, or left can be animated but background-color cannot be, unless the jQuery.Color() plugin is used) — Andreas
– Andreas, Commented Dec 3, 2013 at 20:48
or if you are already using jquery UI, no need to add jQuery.color() plugin — A. Wolff
– A. Wolff, Commented Dec 3, 2013 at 20:50
you need query ui for color animation support, but you should Do this with CSS — Toni Michel Caubet
– Toni Michel Caubet, Commented Dec 3, 2013 at 20:58

Kiyarash · Accepted Answer · 2013-12-03 20:52:41Z

2

jQuery don't support background color in animation method... by itself
You have to download the jquery-Color.js from the jQuery site and append it after the jQuery source code, then you can use the animation() with background color
The first line works, because you used CSS method and background-color as a CSS property haven't any problem, In second line you used animation...
and you have to write the css properties as an animation argument in camel-case;
for example background-color, must to be backgroundColor

answered Dec 3, 2013 at 20:52

Kiyarash

2,6188 gold badges37 silver badges62 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

JQuery - background color fade out animation doesn't work

1 Answer 1

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related