Problema al recargar div con jquery y javascript

dperniam · #1 (**permalink**) 05/03/2012, 07:34

Buenos Dias Amigos:
Tengo el siguiente script que me recarga de manera intermitente dos imágenes para simular una alerta visual.

Código:

<head>
<script type="text/javascript">
numImg = 0;
imgs1 = ['../images/green_light_402.png','../images/green_light_402_off.png'];
function cambiar() {
  numImg++;
  if (numImg==imgs1.length) numImg=0;
  document.getElementById('imagen1').src = imgs1[numImg];
}
setInterval( "cambiar()", 600 );
</script>
</head>
<body>

<img src='../images/green_light_402_off.png' id='imagen1' />
</body>

Hasta aquí funciona muy bien, el problema viene cuando se recarga el DIV cada 20 segundos a traves de jquery. La frecuencia del intervalo de carga de las imagenes varia, se acelera o disminuye la velocidad.
Alguien sabe como evitar esta falla? Será necesario borrar las variables antes de la recarga?
De antemano, muchas gracias por su ayuda.

maycolalvarez · #2 (**permalink**) 05/03/2012, 07:42

deberías usan un GIF animado, es mucho más simple

djaevi · #3 (**permalink**) 05/03/2012, 07:49

hola, antes que nada fijate que tienes tu codigo javascript dentro del head, por ende deberias llamar en algun lado la funcion cambiar(); por otro lado yo pondria el set interval dentro de la funcion asi cada vez que la llamas, estas llamando tambien al intervalo, yo dejaria tu codigo asi:

Código HTML:

Ver original<head>
<script type="text/javascript">

Código Javascript:

Ver originalnumImg = 0;
imgs1 = ['../images/green_light_402.png','../images/green_light_402_off.png'];
function cambiar() {
  numImg++;
  if (numImg==imgs1.length) numImg=0;
  document.getElementById('imagen1').src = imgs1[numImg];
  setTimeout( "cambiar()", 600 );
}

Código HTML:

Ver original</script>
</head>
<body onload="cambiar();">
 
<img src='../images/green_light_402_off.png' id='imagen1' />
</body>

Pruebalo y fijate si te funciona, Saludos

caricatos · #4 (**permalink**) 05/03/2012, 11:07

Hola:

Normalmente los temas que tratan con jquery se mueven al subforo correspondiente

, pero me parece que no es el caso

Saludos

dperniam · #5 (**permalink**) 06/03/2012, 13:57

Hola Djaevi:
Gracias por tu respuesta, la verdad he intentado colocando el setTimeinterval como SetTimeout dentro del script, sin embargo, solo funciona si coloco los script fuera de la etiqueta <head>.
Ahora bien, como yo necesito aproximadamente 10 script similares para simular diversos eventos de alarma, cuando cargo los 10 scripts, el sistema deja de funcionar. Solo funciona cuando cargo 1 script.

Podrias darme otra opinion a ver que sucede?
Muchas Gracias!

djaevi · #6 (**permalink**) 06/03/2012, 17:35

te fijaste en la consola de errores si te arroja algun error? a lo mejor el codigo funciona bien pero estas teniendo algun error de sintaxis porque al parecer estas haciendo todo bien :S revisa eso y me avisas

dperniam · #7 (**permalink**) 07/03/2012, 07:16

Hola Amigos:
Muchas gracias por sus respuestas.
A la final me decidi por utilizar un GIF Animado como me recomendo MAYCOLALVAREZ.
Lo hice con el programa imagemagick de Linux.

Muchas gracias de nuevo, Saludos y hasta una proxima oportunidad