Agregar efectos de transcición en slideshow de fondo

evelyn2006 · #1 (**permalink**) 05/03/2009, 08:41

Hola amigos del foro estoy realizando un sitio web en el que utilizo un slideshow de imagenes como fondo de la pagina.
Tengo el codigo javascript con el que hago el slideshow incluyendolo entre los tags <head></head> y es el siguiente:

Código:

<style>
body{
background-position: center;
}
</style>

<script language="JavaScript1.2">


var bgslides=new Array()
bgslides[0]="imagen01.jpg"
bgslides[1]="imagen02.jpg"
bgslides[2]="imagen03.jpg"

var speed=3000


var processed=new Array()
for (i=0;i<bgslides.length;i++){
processed[i]=new Image()
processed[i].src=bgslides[i]
}

var inc=-1

function slideback(){
if (inc<bgslides.length-1)
inc++
else
inc=0
document.body.background=processed[inc].src
}

if (document.all||document.getElementById)
window.onload=new Function('setInterval("slideback()",speed)')

</script>

Funciona correctamente pero el cambio entre imagenes se realiza sin ningun tipo de efecto por lo que la presentaction no se ve muy elegante, lo que quiero saber es como agregar algun tipo de efecto de transicion tipo "fade in" "fade out" entre las imagenes.
Gracias por su ayuda.

Panino5001 · #2 (**permalink**) 05/03/2009, 09:01

Fijate si te sirve: http://www.disegnocentell.com.ar/notas2.php?id=239

evelyn2006 · #3 (**permalink**) 05/03/2009, 14:35

Gracias por responder Panino5001 el problema es que no domino aun javascript y no se por donde empezar para añadir los efectos de transicion al script con el que cuento, este me lo proporciono un amigo.
Serias tan amable de darme alguna pautas, te lo agradeceria mucho.

CHuLoSoY · #4 (**permalink**) 06/03/2009, 09:02

Gracias Panino5001. La página es interesantísima!
evelyn2006: al final de la página que te dio Panino5001 está todo el código disponible para que lo metas en tu web, sólo llamando a las funciones. El documento está muy bien explicado, y es interesante para desarrollar nuevos scripts (aunque este funciona PERFECTO en todos los navegadoreS)

un saludo.

Panino5001 · #5 (**permalink**) 06/03/2009, 10:58

Muchas gracias a vos. Me alegra que te guste

hector_he · #6 (**permalink**) 12/11/2009, 15:58

Hola:
Recupero este hilo (en vez de crear otro) porque me gustaría utilizar este código java para una web. El problema es que no tengo ni idea de javascript... espero que me puedan ayudar.

Por empezar, no se porque no me funciona el código en el navegador.
He copiado todo igual, pero tengo las imágenes en un carpeta por lo tanto he puesto:

var bgslides=new Array()
bgslides[0]="img/a.jpg"
bgslides[1]="img/b.jpg"

Muchas Gracias!

EDIT: Finalmente me han recomendado "Supersize", lo dejo por si hay interés: http://www.buildinternet.com/project/supersized/