Foros del Web » Programando para Internet » Javascript »

mostrar imagenes progresivamente

Estas en el tema de mostrar imagenes progresivamente en el foro de Javascript en Foros del Web. Enviado - 16/8/2006 quiero ir mostrando progresivamente una serie de imagenes que se vana ir apilando, todo para crear un efecto de animacion, habia pensado ...
  #1 (permalink)  
Antiguo 16/08/2006, 03:54
 
Fecha de Ingreso: agosto-2006
Mensajes: 3
Antigüedad: 17 años, 9 meses
Puntos: 0
mostrar imagenes progresivamente

Enviado - 16/8/2006

quiero ir mostrando progresivamente una serie de imagenes que se vana ir apilando, todo para crear un efecto de animacion, habia pensado hacerlo con capas y un setTimeout que vaya haciendo visibles dichas capas
pero no funciona del todo bien el codigo es el siguiente alguna ayuda o sugerencia?

setTimeout ("mostrar ('capa2')", 0);
setTimeout ("mostrar ('capa3')", 1000);
setTimeout ("mostrar ('capa4')", 2000);
setTimeout ("mostrar ('capa5')", 3000);

<div id="capa2" style="position:absolute;top:0;left:0;visibility:h idden"><img src="imagenes/libre0.png"></div>
etc para las demas capas

Gracias de antemano.
  #2 (permalink)  
Antiguo 16/08/2006, 04:25
Avatar de djreficul  
Fecha de Ingreso: julio-2006
Ubicación: Cork
Mensajes: 672
Antigüedad: 17 años, 10 meses
Puntos: 0
Habría q ver la función mostrar.

También podrías darle un id a la imagen y usar el atributo src para cambiar la imagen en lugar de transformar la capa entera.

Saludos.
__________________
La muerte es un camino que todos debemos recorrer...
  #3 (permalink)  
Antiguo 16/08/2006, 05:58
 
Fecha de Ingreso: agosto-2006
Mensajes: 3
Antigüedad: 17 años, 9 meses
Puntos: 0
con esto del javascript soy bastante novata, asi que como cambio lo del src

aqui dejo la funcion mostrar, aunq lo unico q hace es poner visible las capa que le paso como parametro



function mostrar(nombreCapa){
document.getElementById(nombreCapa).style.visibili ty="visible";
}
gracias por la ayuda
  #4 (permalink)  
Antiguo 16/08/2006, 10:03
Avatar de djreficul  
Fecha de Ingreso: julio-2006
Ubicación: Cork
Mensajes: 672
Antigüedad: 17 años, 10 meses
Puntos: 0
Veamos, si en lugar de capas tomas las rutas de las imágenes en variables puedes tener la imagen tal q así:

Código HTML:
<img src="imagenes/libre0.png" id="imagen"> 
Voy a dejar como supuesto q la ruta q tiene el src es la de la imagen x defecto.

Luego la llamada a los cambios según el tiempo serían prácticamente iguales solo q les pasas como argumento la ruta de la imagen. Si quieres q la función sirva para otras imágenes también podrías pasar como argumento el id q le has puesto.

Código HTML:
setTimeout ("mostrar ('imagen',rutaimagen1)", 0);
setTimeout ("mostrar ('imagen',rutaimagen2)", 1000);
setTimeout ("mostrar ('imagen',rutaimagen3)", 2000);
setTimeout ("mostrar ('imagen',rutaimagen4)", 3000);
Las variables "rutaimagenx" son en las q deberías definir la ruta hasta la imagen q quieres mostrar.

Eso x si quieres usar la función para imagenes diferentes a variar dentro de una misma página. Luego la función mostrar quedaría así:

Código HTML:
function mostrar(idImagen,ruta){
document.getElementById(idImagen).src=ruta;
}
Espero q entiendas lo q kiero decir. Seguro q hay soluciones más simples pero vamos, esto es una idea para q no tengas q cargar las imágenes previamente en X capas para mostrar y ocultar... Lo q pasa q también por el método q he expuesto puede okurrir q la imagen cuando haga el cambio tarde un poko en hacerlo.

Sobre tu función mostrar también falta q okulte la q anteriormente mostraba para q haga el efecto q parece q deseas...

Saludos.
__________________
La muerte es un camino que todos debemos recorrer...
  #5 (permalink)  
Antiguo 17/08/2006, 00:53
 
Fecha de Ingreso: agosto-2006
Mensajes: 3
Antigüedad: 17 años, 9 meses
Puntos: 0
gracias por la aclaracion
lo voy a probar , de todos modos no quiero ocultar solo quiero ir mostrando pq son png con transparencia

pero lo que tu me has puesto creo que m sirve

gracias otra vez
Atención: Estás leyendo un tema que no tiene actividad desde hace más de 6 MESES, te recomendamos abrir un Nuevo tema en lugar de responder al actual.
Respuesta




La zona horaria es GMT -6. Ahora son las 03:25.