Artificium:
Lo había interpretado mal y celebro que sea algo leve.
Por cierto: perdona de nuevo mi atrevimiento, pero me ha surgido un pequeño contratiempo con otra presentación de imágenes con efecto fundido (fade creo que se llama):
Tengo un código en el que cinco imágenes van apareciendo automáticamente una tras otra con un efecto de fundido entre ellas. El problema es que tarda mucho (unos 12 segundos) hasta que se produce el primer cambio de imagen. Y lo más curioso es que no empieza por la imagen 01, sino que al empezar, ya aparece en pantalla la imagen 05. Cuando, después de 12 segundos, comienza a funcionar, pasa un instante a la imagen 04, de nuevo vuelve a la 05 y luego ya pasa a la 01 para seguir con normalidad.
He revisado todo varias veces pero no encuentro el error que motiva esto.
Te pego aquí debajo el código por si tú o alguien del foro puede ayudarme. Me interesa este efecto porque funciona con los tres navegadores más conocidos (IE, Mozilla y Chrome).
----------------------------------------------------------------------------
<htlm>
<head>
<script type='text/javascript'>
//<![CDATA[
window.addEventListener?window.addEventListener("l oad",so_init,false):window.attachEvent("onload",so _init);
var d=document, imgs = new Array(), zInterval = null, current=0, pause=false;
function so_init() {
if(!d.getElementById || !d.createElement)return;
imgs = d.getElementById("imageContainer").getElementsByTa gName("img");
for(i=1;i<imgs.length;i++) imgs[i].xOpacity = 0;
imgs[0].style.display = "block";
imgs[0].xOpacity = .99;
setTimeout(so_xfade,1000);
}
function so_xfade() {
cOpacity = imgs[current].xOpacity;
nIndex = imgs[current+1]?current+1:0;
nOpacity = imgs[nIndex].xOpacity;
cOpacity-=.05;
nOpacity+=.05;
imgs[nIndex].style.display = "block";
imgs[current].xOpacity = cOpacity;
imgs[nIndex].xOpacity = nOpacity;
setOpacity(imgs[current]);
setOpacity(imgs[nIndex]);
if(cOpacity<=0) {
imgs[current].style.display = "none";
current = nIndex;
setTimeout(so_xfade,3000);
} else {
setTimeout(so_xfade,50);
}
function setOpacity(obj) {
if(obj.xOpacity>.99) {
obj.xOpacity = .99;
return;
}
obj.style.opacity = obj.xOpacity;
obj.style.MozOpacity = obj.xOpacity;
obj.style.filter = "alpha(opacity=" + (obj.xOpacity*100) + ")";
}
}
//]]>
</script>
<style>
#imageContainer {
position: relative;
}
#imageContainer {
height: 700px;
width: 350px;
}
#imageContainer img {
left:0;
position: absolute;
top:0;
}
</style>
</head>
<body>
<div id="imageContainer">
<img src="01.jpg" />
<img src="02.jpg" />
<img src="03.jpg" />
<img src="04.jpg" />
<img src="05.jpg" />
</div>
</body>
</html>
-----------------------------------------------------------------------
Un saludo desde España.