Inicio » Javascript » Artículos » Imagen que se desvanece

Imagen que se desvanece

Por Fabio Núñez

Artículos publicados: 2
Valoración media: 3.94/5
Usuario desde: 04/01/2003

Podemos conseguir un bonito efecto de desvanecimiento de imágenes de la siguiente forma.

Introducir el siguiente script dentro del HEAD

<script>
   nereidFadeObjects = new Object();
   nereidFadeTimers = new Object();
function nereidFade(object, destOp, rate, delta){
   if (!document.all)   return
   if (object != "[object]"){ 
      setTimeout("nereidFade("+object+","+destOp+","+
      rate+","+delta+")",0);
      return;
   }
   clearTimeout(nereidFadeTimers[object.sourceIndex]);
   diff = destOp-object.filters.alpha.opacity;
   direction = 1;
   if (object.filters.alpha.opacity > destOp){
      direction = -1;
   }
   delta=Math.min(direction*diff,delta);
   object.filters.alpha.opacity+=direction*delta;
    if (object.filters.alpha.opacity != destOp){
      nereidFadeObjects[object.sourceIndex]=object;
      nereidFadeTimers[object.sourceIndex]=
      setTimeout("nereidFade(nereidFadeObjects["+object.sourceIndex+"],"
         +destOp+","+rate+","+delta+")",rate);
   }
}
</script>

Intoducir el siguiente script en el body, y luego cambiar el origen de la imagen y el enlace si lo tuviera.

<a onFocus=if(this.blur)this.blur() href="javascript:;">
 <img onMouseOver=nereidFade(this,50,30,5)
  style="FILTER: alpha(opacity=100)" 
 onMouseOut=nereidFade(this,100,00,5) 
 height=15   src="imagenes/afiliados.gif"  
 width=133 border=0> 
</a>

Bio:
Fabio Núñez, es el creador de www.dreamweavering.com, el único portal en español dedicado a Macromedia Dreamweaver.

Actualmente se dedica a la enseñanza de Diseño y programación, y a la realización de webs por encargo.

Otros artículos recientes de este autor: