Fade Slide Foto

Fade Slide Foto.

Un script básico con el que podemos hacer una presentación de fotos con efecto “aparece desaparece progresivo”. Se puede añadir una imagen de fondo fija para acentuar el efecto opacidad, mejor sin el marco. En fin, tú mismo…

<script type=”text/javascript”>
<!– Copyleft 2006 – 2009, ScriptShow – scriptshow@hotmail.com –>
<!– Feel free to use if you leave this header intact! –>
<!–
Imgs=new Array(“imagen_01.jpg”,”imagen_02.jpg”,”imagen_03.jpg”,”imagen_04.jpg”)

step=1;
opac=0;
count=0;
timer=””;

function ImgsFader(){
fadeEl=document.getElementById(“fadimg”);
fadeEl.src=Imgs[count];
opac+=step;

if(fadeEl.filters){
fadeEl.filters.alpha.opacity=opac;
}
else{
fadeEl.style.KHTMLOpacity=(opac/100)-0.001;
fadeEl.style.MozOpacity=(opac/100)-0.001;
fadeEl.style.opacity=(opac/100)-0.001;
}

timer=setTimeout(“ImgsFader()”,10);

if(opac>=100){
clearTimeout(timer);
opac=100;
step=-step;
setTimeout(“ImgsFader()”,2000);
return;
}

if(opac<0){
clearTimeout(timer);
step=-step;
count++;
if(count==Imgs.length){
count=0;
}
ImgsFader();
}
}

setTimeout(“ImgsFader()”,1000);
//–>
</script>

<h1><span>Fade Slide Foto</span></h1>

<center>
<div style=”width:600px;height:400px;border:8px solid #647369;background-color:#0E0E0E”>
<img src=”” id=”fadimg” hspace=”10″ vspace=”10″ style=”filter:alpha(opacity=0);-khtml-opacity:0;-moz-opacity:0;opacity:0″>
</div>
</center>

P.D.: Para evitar la precarga de imágenes, se pueden reducir a un tamaño aceptable (400×300) max. Se trata de minimizar el “salto – guiño” en ausencia de imagen disponible.

Un saludo.

Fade Slide Foto

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