removeClass and fade animation

Question

I have this code

    
LINK1

        

Answer 1

You can't fade from one class to another. You have to tell jQuery what properties to animate in the .animate() method.

To get the next li element, use .next().

Answer 2

AFAIK i dont think you can add a fadeOut() to a removeClass(). Someone correct me if i'm wrong!

Answer 3

not sure if you can do this with straight jQuery, but I know jQuery UI has a modified removeClass() that lets you add a duration to remove the class over jQuery UI Docs

Answer 4

Yeah, you could do this with some CSS3.

You just add the following to .current.

.current{
    color: #f00;
    background-color: #000;
    transition: color 0.5s, background-color 0.5s;
    -webkit-transition: color 0.5s, background-color 0.5s; /* Safari */
}

Obviously you'll need to change color/background-color to the attributes you'd like to animate. Otherwise, Cubed Eye's suggestion of including JqueryUI is great, as the removeClass in jQueryUI will do it all for you..