Ayuda con slide de fotos

juanf03 · #1 (**permalink**) 13/03/2009, 17:17

Necesito pasar fotos cada x segundos, tengo este javascript que me proporcionó un usario de acá:

Código HTML:

<script type="text/javascript">
 function callback() {
 window.location.href = "actitud.php?pagina=<?php echo ((int)$_GET['pagina'] + 1); ?>";
     }
        setTimeout("callback()", 9000); 
      </script>

En sí el script anda bien, pero me gustaría que cuando llegue a la ultima foto deje de incrementar( considerar que el tamaño de las fotos es variable), y además me gustaría que el usuario tenga la opción de activar el "auto-slide" de fotos.....alguien sabe como hacer esto??

Adell · #2 (**permalink**) 13/03/2009, 18:14

Hola
seguramente vas a tener mas ayuda si lo pones en el foro de javascript

saludos

juanf03 · #3 (**permalink**) 13/03/2009, 18:21

me lo pueden mover??

jam1138 · #4 (**permalink**) 13/03/2009, 21:30

Cita:

Iniciado por juanf03

me lo pueden mover??

Servido. Tema movido desde PHP.

En un principio iba a sugerir mantenerlo en el foro de PHP, pues viendo lo que tienes ahora depende de un valor pasado por URL, y ya que mencionas el número de imágenes es variable, lo más probable es que para conocer dicho dato se necesite de PHP ...

Por el poco código que dejas (...), me supongo es una página que constantemente se está recargando mostrando la imágenes como contenido. Primero invitarte a ser claros de tu situación, explicar y mostrar bien el contexto; segundo ... si el funcionamiento de lo que tienes ahora es como lo tengo en mente, que cosa tan horrible!!. Por ello finalmente muevo tu tema a JavaScript; de entrada se me ocurre mejor crear un arreglo con los archivos a mostrar y variar la fuente con JS.

Suerte, ojalá alguien te pueda decir algo más ... de mi parte, insisto, considero es muy poca la información que aportas como para tener clara la idea de lo que quieres realizar.

juanf03 · #5 (**permalink**) 14/03/2009, 10:32

Bueno, les voy a dar mas información, la cosa es que tengo esta presentación de fotos que hice con paginación en php:

Código PHP:

  <?php
include("connect.php");
$registros = 1; 
$pagina=$_GET["pagina"];
//veo si la variable pag esta definida, si no esta la mando a la primera pag
if (!$pagina) {
$inicio = 0;
$pagina = 1;
}
else {
$inicio = ($pagina - 1) * $registros;
}
//saco total de registros
$resultados = mysql_query("SELECT nombre FROM fotos where categoria='otras'");
$total_registros = mysql_num_rows($resultados);
//pido los registros desde inicio hasta el limite $registros
$resultados = mysql_query("SELECT nombre FROM fotos WHERE categoria='otras' ORDER BY nombre ASC LIMIT $inicio, $registros");
//cant de paginas necesarias
$total_paginas = ceil($total_registros / $registros);
//imprimo resultados

while(($foto=mysql_fetch_array($resultados))) {
if($pagina!=$total_paginas)
echo "<a href='otras.php?pagina=".($pagina+1)."'><IMG SRC=\"pics/otras/".$foto["nombre"]."\"/></br></a>";
else
echo "<center><IMG SRC=\"pics/otras/".$foto["nombre"]."\"/ border=0></br></center>";

}
//cuando mostrar enlace a pag "anterior""
if(($pagina - 1) > 0) {
echo "<a href='otras.php?pagina=".($pagina-1)."'>< Anterior</a>";
} 

//número de paginas "intermedias" a mostrar
for ($i=1; $i<=$total_paginas; $i++){
if ($pagina == $i) {
echo "<b>".$pagina."</b> ";
} else {
echo "<a href='otras.php?pagina=$i'>$i</a> ";
} }
//cuando mostrar el enlace ""siguiente""
if(($pagina + 1)<=$total_paginas) {
echo "<a href='otras.php?pagina=".($pagina+1)."'>Siguiente></a>";
} 

?>

y como dije antes, tengo el siguiente javascript:

Código HTML:

<script type="text/javascript">
 function callback() {
 window.location.href = "actitud.php?pagina=<?php echo ((int)$_GET['pagina'] + 1); ?>";
     }
        setTimeout("callback()", 9000); 
      </script>

Me gustaría saber como puedo hacer para:

a)que sea decisión del usuario que las fotos pasen automáticamente, o sea, que pueda tocar un botón y que las fotos comienzen a pasar(así como también que pueda detener el "pasaje automático".
b)que al llegar a la última foto se detenga....

Si necesitan mas información me dicen...

juanf03 · #6 (**permalink**) 14/03/2009, 11:34

nadie?.....

juanf03 · #7 (**permalink**) 14/03/2009, 19:04

necesito ayuda con esto por favor....

sweetlydark · #8 (**permalink**) 15/03/2009, 09:43

Vas a tener que jugar con setTimeout, puedes colocarlo en un variable y usar clearTimeout("variable") para parar los intervalos. Con eso puedes usar distinto indicadores para parar tu script y empezarlo de nuevo.

//mientras que lo estoy editando (no como se me comio una palabra :P) añado tambien que estoy de acuerdo con lo que dice buzu abajo.

buzu · #9 (**permalink**) 15/03/2009, 12:17

Lo que necesitas es meter el numero total de imágenes en una variable y checar cada vez que haces una llamada a callback() que tus imágenes no sean más que tu variable. Por lo que veo, no es difícil lo que quieres hacer, pero de la forma en la que lo estás haciendo, creo que no lograrás un efecto que sea amistoso con el usuario.

juanf03 · #10 (**permalink**) 15/03/2009, 17:17

me podrían dar algún scritp que tengan para lograr esto???, porque el número de elementos es variable....O sea, no se mezclar javascript con php y mysql, se puede???

buzu · #11 (**permalink**) 15/03/2009, 18:42

A ser sincero, si, si te lo podría dar, pero la verdad prefiero no hacerlo. No te estaría ayudando si lo hiciera y estoy aqui para ayudar y no para hacer lo contrario. Me parece que hasta ahora lo que has hecho ha sido no mas que simple copy & paste. Te sugiero que investigues sobre las tecnologías que usas, en este caso php y javascrip. Aprende a usar dichas tecnologías y dominalas. Creo que eso es lo más que te puedo decir al respecto.

Ahora con lo de tu problema:
Haz una petición a la base de datos para calcular el numero de imágenes distintas. Guarda ese valor en una variable de Js, se oye como estar viajando de un lenguaje al otro, pero en realidad lo único que tienes que hacer es un echo. Después puedes usar ese valor como un límite para tu javascript, cuando se haya alcanzado ese limite cancelas el timeout y listo. Por cierto, ya que estás usando js te convendría hacer algo de forma un poco "asincrona". No me refiero a usar ajax, por que no es necesario, sino más bien a usar DOM scripting para cambiar el valor del src de la imagen de la pagina principal así te evitas el estar recargando toda la página que seguro que debe ser un dolor de cabeza y un fastidio para el usuario.

Por lo que veo tu php lo has modificado de algún otro lugar. No se mira como que lo hayas escrito exclusivamente para esta pagina. Creo que puedes modificarlo de modo que reduzcas el tamaño ya que tienes algunas lineas redundantes y otras necesarias.

juanf03 · #12 (**permalink**) 15/03/2009, 20:03

una pregunta, me podes decir como hacer eso del dom scripting???, por favor, estoy leyendo cosas a full, pero justamente ese es un problema que quería solucionar, no quiero ercargar toda la pagina, únicamente quiero que cambie la imagen, como puedo hacer'?????, si me podes dar un ejemplo de las cosas que decis asi veo como es mejor, porque siempre ayuda ver un ejemplo, saludos

sweetlydark · #13 (**permalink**) 15/03/2009, 21:00

DOM scripting es básicamente utilizar javascript para manipular los elementos de una pagina. Puedes leer sobre eso aqui, tiene ejemplos que te ayudara a entenderlo mejor.