Question

I have the following code.

   $("[id^=menuItem]").mouseenter(function () {
      $(this).animate({ width: 400, backgroundColor: "black" }, 1000);
   });

When i hover with the mouse, the regarded div does get wider BUT there is no change in the beckground color (it differs from black, of course). What can be the problem? I try to follow the suggestion at the following link, the example of which indeed seem to work.

http://docs.jquery.com/UI/Effects/ColorAnimations

Answer 1

The jQuery UI effects core extends the animate function to be able to animate colors as well.

You’ll need to include the jQuery UI library before you can do this.