Efecto con jquery

[agudogpr]

hola buenas, os comento, estoy empezando con jquery y ya he hecho algunas cosillas, va de fabula. lo que no logro hacer es un efecto sencillo con el animate. Vereis, tengo una barra de botones, sencilla, cuyas imagenes cambio al pasar por encima con el mousover, entoces, me gustaria conseguir el efecto del "mouseout" que al salir, la imagen que hay en ese momento, se vaya pero poco a poco, como fadeout o algo asi. este es mi codigo,haber si me podeis echar una mano. Gracias.

Código Javascript:

$(document).ready(function()    
        {
            $("#home,#alumnos,#profesores").mouseover(function()
            {
                var imagen= this.id;
                $("#"+imagen).attr("src","images/btnOver.png");
            });
 
            $("#home,#alumnos,#profesores").mouseout(function()
            {
                var imagen= this.id;
                $("#"+imagen).attr("src","images/btnNormal.png");
            });
        });
 

[caricatos]

Tema movido desde javascript

[mayid]

Yo cambiaría esto:

var imagen= this.id;
$("#"+imagen).attr("src","images/btnNormal.png");

... por esto:

$("this")).attr("src","images/btnNormal.png");

El this entre parentesis es nativo en jQuery.

En cuanto al animate... no estas publicando tu codigo. Como lo hacés?

Una fadeout sería así:

$("this").fadeOut("slow");