Fade-Effect para una Capa, Imagen, etc.

Se trata de un sencillo Script de 1Kb. para aplicar efecto fade a un objeto. El control puede ser un evento en un enlace, botón, o, en el propio objeto, en éste último caso, claro está, la opacidad no debe ser total.

<script language=”javascript” type=”text/javascript”>
<!– Copyleft 2006 – 2009, ScriptShow – scriptshow@hotmail.com –>
<!– Feel free to use if you leave this header intact! –>
<!–
opac=0
goIn=null

function fade(dir){
if(document.all){document.all(“fadimg”).filters.alpha.Opacity=opac}
if(document.getElementById && !document.all){document.getElementById(“fadimg”).style.MozOpacity=(opac/100)-0.01}
if(document.getElementById && !document.all){document.getElementById(“fadimg”).style.KHTMLOpacity=(opac/100)-0.01}
if(document.getElementById && !document.all){document.getElementById(“fadimg”).style.opacity=(opac/100)-0.01}
if(dir==1 && opac<=100){opac=opac+2} else{clearTimeout(goIn)}
if(dir==0 && opac>=0){opac=opac-2} else{clearTimeout(goIn)}
goIn=setTimeout(“fade(‘” + dir + “‘)”, 10)
}
// –>
</script>

<a href=”#” onmouseover=”fade(1)” onmouseout=”fade(0)”>EFECTO</a>

<img src=”imagen.gif” alt=”Imagen” title=”Imagen” width=”200″ height=”200″ id=”fadimg” style=”filter:alpha(Opacity=0);-moz-opacity:0;-khtml-opacity:0;opacity:0;visibility:visible”>
Espero sea útil.

Un Saludo.

Fade-Effect para una Capa, Imagen, etc.

2 comentarios en “Fade-Effect para una Capa, Imagen, etc.

Responder

Introduce tus datos o haz clic en un icono para iniciar sesión:

Logo de WordPress.com

Estás comentando usando tu cuenta de WordPress.com. Cerrar sesión / Cambiar )

Imagen de Twitter

Estás comentando usando tu cuenta de Twitter. Cerrar sesión / Cambiar )

Foto de Facebook

Estás comentando usando tu cuenta de Facebook. Cerrar sesión / Cambiar )

Google+ photo

Estás comentando usando tu cuenta de Google+. Cerrar sesión / Cambiar )

Conectando a %s