setTimeout no funciona

[miguelcubas]

hola a todos, despues de tanto darle vueltas a un, posiblemente,
error tonto que no logro ver, he decidido ver si doy con alguien
que sepa echarme una mano en esto.

La cuestion es que esto me funciono en otro casos, al menos eso
creo, pero no se que pasa cuando:

Código:

for (var c=0 ; c < 100; c++) 
 setTimeout('setOp(' + document.getElementById('as') + ',' + c + ')' , 100);

Esto deberia ejecutar la funcion 100 veces a un intervalo de 100 ms

A cada llamada se programa la opacidad de una imagen, con lo que
como resultado da un fundido de 0 a 100.


Pero no ocurre esto, a la primera llamada se para.



En otro codigo que tengo exactamente igual, lo que hace es en
la primera llamada lo pone a 100 de opacidad.

Alguien sabe dicirme....

Gracias

[David]

Lo que pasa es que el código no se está ejecutando cada 100 milisegundos, sino 100 milisegundos después de haber sido asignado, lo cual ocurre tan rápido que no te permite ver el efecto, quizás la forma más simple de solucionarlo sea ejecutarlos en 100, 200, 300, 400... multiplicando 100 por el contador del bucle.

Creo recordar que nuestro amigo derkenuke había colocado una solución para eso, habrá que buscar el tema.

[venkman]

El problema es, además de lo dicho por David El Grande, que estás modificando c.

Quiero decir, en el bucle vas aumentando c y lanzando los timeouts con la referencia a c. Lo que van a ver esos timeout no va a ser el valor de c en el momento de crear el timeout, sino en el momento de ejecutarse.

La solución a ambos problemas es fácil: No lances los timeout en un bucle sino uno después de otro:

Código javascript:

function opacidad(opac) {
    opac = opac || 0;
    setOp(document.getElementById('as'),opac);
    if (opac<100) setTimeout(function() { opacidad(opac+1) } , 100);
}
// y lo lanzamos donde corresponda así:
opacidad();
 

[Panino5001]

Otra manera:

Código PHP:

  for (var c=0 ; c < 100; c++) 
    (function(c){
     setTimeout(function(){setOp(document.getElementById('as'),c);} , 100*c);
    })(c); 
   

[venkman]

Aunque correcta formalmente, le veo a esa manera dos pegas (pequeñas :) ).

La primera es que es más frágil ante interrupciones. Es decir, es más probable que si el navegador está muy ocupado y se produce algún salto, esos saltos sean mucho más violentos.

Además, así estás creando "de golpe" 100 timeouts. Esto ya en sí mismo puede ser suficiente para hacer que el navegador se estrese un poco.

[miguelcubas]

Muchas gracias, ya esta claro.

[Panino5001]

Iniciado por venkman

Aunque correcta formalmente, le veo a esa manera dos pegas (pequeñas :) ).

La primera es que es más frágil ante interrupciones. Es decir, es más probable que si el navegador está muy ocupado y se produce algún salto, esos saltos sean mucho más violentos.

Además, así estás creando "de golpe" 100 timeouts. Esto ya en sí mismo puede ser suficiente para hacer que el navegador se estrese un poco.

Totalmente de acuerdo.

[Dalvenjha]

Ante tanta grandeza de opiniones, mejor me guado mi codiguito humilde. =$

Luis, humilde.