Question

I am wondering for some time now, how did SO do this animation on answers when you click on link answer, answer divs color changes for some time and it reverts back, I’m sure this question has been asked before but I just couldn’t find it. Or this random example :

https://stackoverflow.com/questions/2706443/what-pitfalls-if-any-are-there-to-learning-c-c-as-a-first-language/2706531#2706531

UPDATE

I see some good answers, but not quite what I’m looking for or maybe I’m sleepy , for ex:

I have a div with id #footer , so if I type http://mysite.com#footer it will scroll me down to the footer div, how can I pass the argument which div to animate by just visiting the url http://mysite.com#footer

Answer 1

Using jQuery’s Color plugin is the easiest way to animate colors:

http://plugins.jquery.com/project/color

Once that plugin is included, you can animate any colors. For example, to set an element to yellow and then slowly fade it back (over 5 seconds, say):

$("#something").css("background-color", "yellow") // set the background to yellow
               .animate({"background-color": "white"}, 5000); // fade to white

Of course, you can use hex colors instead of the color names as well (ex. “#FFFF00” instead of yellow).