
Utilizando jQuery podemos crear de una forma muy sencilla efectos de Fade, es decir, ocultar o mostrar un elemento de forma gradual. Para poder realizar un efecto de Fade en jQuery utilizaremos los métodos .FadeOut() y .FadeIn().
Pero lo primero será poner un elemento sobre el que aplicar el efecto Fade. En nuestro caso utilizaremos una imagen.

Ahora ponemos los enlaces para ocultar y mostrar:
Ocultar | Mostrar
Lo que haremos ahora será poner el código jQuery que controle el evento onclick sobre estos enlaces. Para poder hacer esto necesitamos el método click sobre los enlaces.
$("#mostrar").click(function(e){
// Efecto Fade
});
Ya solo nos quedará el ejecutar los efecto con los métodos .FadeOut() y .FadeIn().
$("#ocultar").click(function(e){
$("#logo").fadeOut();
});
$("#mostrar").click(function(e){
$("#logo").fadeIn();
});
Si queremos podemos configurar el tiempo en el cual realizamos el efecto del face. Para ello pasaremos el tiempo, en milisegundos, a las funciones .FadeOut() y .FadeIn().
$("#ocultar").click(function(e){
$("#logo").fadeOut(2000);
});
$("#mostrar").click(function(e){
$("#logo").fadeIn(2000);
});
Algo sencillo realizar un efecto de fade en jQuery.
m++
Hola, sabés como se puede lograr un efecto de fadeout sobre las imagenes que no tengo seleccionadas..para decirlo mas claro: necesito que al hacer rollover sobre una imagen, me baje la opacidad de una tira de imagenes, que van a estar en div contenedor..Desde ya, muchas gracias, si tienes algun tutorial o ejemplo de aplicacion para ese efecto..
Víctor Cuervo
@Mith,
Lo tienes en el botón de visualizar. :-D
La URL del ejemplo es http://lineadecodigo.com/wp-content/uploads/2012/03/efecto-fade.html
Espero que te guste.
Mith
Quizá lo único que le falta es un ejemplo en vivo ^^