Imagenes Secuenciales

El_Aprendiz · #1 (**permalink**) 22/02/2006, 10:05

Saludos:

Estoy haciendo una apliacion en PHP y me piden que en la parte superior de la misma aparesca unas fotografias y letras secuencialmente, tal y como aparecen en esta pagina donde salen lo niños y niñas para que tengan una idea mas clara de lo que digo http://www.redviva.org/quienes_son.html.

El otro detalle es que si se puede hacer con PHP y como hacerlo o se necesita un editro de imagenes como paintshop para crear la imagen y luego solo invocarla no lo se, a lo mejor es en otra categoria como javascrip no se por esa razon le preguntos.

Una vez mas gracias por su tiempo

Atentamente
El_Aprendiz

claudiovega · #2 (**permalink**) 22/02/2006, 10:09

Eso es flash, se podría hacer con javascript tambien.

El_Aprendiz · #3 (**permalink**) 22/02/2006, 20:31

Pero como lo hago con javascript no tengo ni idea, o lo como lo hago con fireworks?

KarlanKas · #4 (**permalink**) 26/03/2006, 08:09

Para lo que quieres hay un script que tomé de no sé dónde que hace transiciones de una imagen a otra con javascript. El problema está en que los efectos sólo se verán en IE, aunque la transición se hará en todos los navegadores.

En el array pics pondrás las imágenes que quieres que vayan cambiándose.
Un ejemplo es:

Código:

<html>
<head>
	<title>Untitled</title>
	<script>
<!-- Original:  CodeLifter.com ([email protected]) -->
<!-- Web Site:  http://www.codelifter.com -->

<!-- Begin
// Set slideShowSpeed (milliseconds)
var slideShowSpeed = 6000;
// Duration of crossfade (seconds)
var crossFadeDuration =2;
// Specify the image files
var Pic = new Array();
// to add more images, just continue
// the pattern, adding to the array below

Pic[0] = 'img/sucesion1.jpg'
Pic[1] = 'img/sucesion2.jpg'
Pic[2] = 'img/sucesion3.jpg'

// do not edit anything below this line
var t;
var j = 1;
var p = Pic.length;
var preLoad = new Array();
for (i = 0; i < p; i++) {
preLoad[i] = new Image();
preLoad[i].src = Pic[i];
}
function runSlideShow() {
if (document.all) {

document.images.imagen3.style.filter="blendTrans(duration="+crossFadeDuration+")";
document.images.imagen3.filters.blendTrans.Apply();
}
document.images.imagen3.src = preLoad[j].src;
if (document.all) {
document.images.imagen3.filters.blendTrans.Play();
}
j = j + 1;
if (j > (p - 1)) j = 0;
t = setTimeout('runSlideShow()', slideShowSpeed);
}
//  End -->
</script>
</head>

<body>

<img src="transicion0.jpg" name="imagen3" />

</body>
</html>

Un saludo!

El_Aprendiz · #5 (**permalink**) 27/03/2006, 11:42

Saludos:
He hecho tal y como me dijistes solamente cambie el nombre de las imagenes a mostrar y aumente dos mas ya que son cinco imagenes, el problema es que a la hora de correlso desde el IE no me muestra las imagenes es decir solo me muestra el clasico cuadrito con la "x" cuando la imagen no esta disponible.

El cambio que hago es el siguien:

Pic[0] = 'imagenes\Foto1.JPG'
Pic[1] = 'imagenes\Foto2.JPG'
Pic[2] = 'imagenes\Foto3.JPG'
Pic[3] = 'imagenes\Foto4.JPG'
Pic[4] = 'imagenes\Foto5.JPG'

Luego probe de la siguiente forma:

Pic[1] = 'C:\SITIO WEB CDI\www\cdi\imagenes\Foto2.JPG'
Pic[2] = 'C:\SITIO WEB CDI\www\cdi\imagenes\Foto3.JPG'
Pic[3] = 'C:\SITIO WEB CDI\www\cdi\imagenes\Foto4.JPG'
Pic[4] = 'C:\SITIO WEB CDI\www\cdi\imagenes\Foto5.JPG'

y Despues probé las dos formas anteriores cambiena comilla simple ' por comillas dobles " y quedo igual.

Debo aclarar que no se si esto es necesario decirlo es que estoy trabajando como paginas PHP. APACHE. My SQL no lo se en fin tengo problemas con esto es codigo que tengo actualmente y que no me funciona es el siguiente:

Espero que puedas ayudar a solucionar el problema gracias por tu tiempo.

ah se me olvidama el otro vambio que hice fue simplemente hacer mas grande el cuadrito donde se quiere mostrar las imagenes
era asi:
<img src="transicion0.jpg" name="imagen3" />
lo tengo asi
<div align="center"><img src="transicion0.jpg" name="imagen3" width="739" height="159" />

el codigo lo tengo asi:

Cita:

<html>
<head>
<title>Untitled</title>
<script>




</script>
</head>

<body>

<div align="center"><img src="transicion0.jpg" name="imagen3" width="739" height="159" />

</div>
</body>
</html>

Gracias por tu ayuda, espero pueda solucionarlo..

Atentamente
El_Aprendiz