Animate not working with jQuery

Hi all,

Quick question, I’m trying to use jQuery to fade in a new background every time the new quote button is pressed on my random quote app project. I can’t seem to get it to work however. The background is changing fine when I use:

$("#app").css("background-color", color);

And the code I’m replacing this with is:

$("#app").animate({backgroundColor: color}, 1000);

https://codepen.io/jamiegaskell89/pen/LYyOrGN

It’s probably something simple I’m missing.

Cheers!

In this case, reading the docs is necessary.

Animation Properties and Values

All animated properties should be animated to a single numeric value, except as noted below; most properties that are non-numeric cannot be animated using basic jQuery functionality (For example, width, height, or left can be animated but background-color cannot be, unless the jQuery.Color plugin is used).

http://code.jquery.com/color/jquery.color-2.1.2.min.js

1 Like

This topic was automatically closed 182 days after the last reply. New replies are no longer allowed.