Me funciona pero porque pasa esto?

eybel · #1 (**permalink**) 09/11/2011, 12:18

Hola puse un codigo en mi web para cambiar el src de una imagen cada 10 segundos, funciona barbaro si pongo el javascript set interval en el tag BODY pero si lo pongo adentro del tag IMG hace un efecto raro en las imagenes y queria saber si me podrian explicar poque:

javascript:

Código PHP:

  // slideshow image counter
var i = 0;
function slideShow() 
{
 // set up list of images
 slidesArray = new Array()
 
 slidesArray[0]="../banners/banner_top_2.png"
 slidesArray[1]="../banners/banner_top_1.png"
 
 // load image
 document.getElementById('top_banner').src=slidesArray[i]
 
 // increment counter
 i=i+1;
 
 // when at the end, start again
 if(i==2) { i=0; }
}

ASI FUNCIONA BIEN:

Código PHP:

  <body onLoad="javascript:setInterval('slideShow()',10000);">
<div class="mainbanner"><img src="/banners/banner_top_1.png" name="image" id="top_banner"></div>

Asi funciona mal, hace como un flash del otro banner al recargar cada 10 segundos, la diferencia aca es que el javascript esta adentro del IMG tag:

Código PHP:

  <body>
<div class="mainbanner"><img src="/banners/banner_top_1.png" name="image" id="top_banner" onLoad="javascript:setInterval('slideShow()',10000);"></div>

Mi pregunta es mas por cuestiones de aprendizaje, mi codigo ya funciona bien.Ah alguna idea como hacer fadeout/fadein effect? de banner a banner?

caricatos · #2 (**permalink**) 09/11/2011, 16:07

Hola:

Con los rollover's normales, solo se puede cambiar el src, pero para efectos deben existir dos imágenes... Mira esto: Rollover fundido... luego puse algunos apuntes sobre transiciones, pero ya se complica el tema...

Saludos

eybel · #3 (**permalink**) 09/11/2011, 16:12

Gracias le voy a dar un vistazo a ver si lo implemento.