Foros del Web » Programando para Internet » Javascript » Frameworks JS »

Secuencia de luces con setTimeout?

Estas en el tema de Secuencia de luces con setTimeout? en el foro de Frameworks JS en Foros del Web. Buenas noches! Estoy intentando realizar un juego de esos que tienen 4 colores, se muestra una secuencia prendiendo luces y luego el usuario debe repetir ...
  #1 (permalink)  
Antiguo 15/06/2014, 19:30
 
Fecha de Ingreso: junio-2014
Mensajes: 1
Antigüedad: 10 años, 5 meses
Puntos: 0
Secuencia de luces con setTimeout?

Buenas noches!
Estoy intentando realizar un juego de esos que tienen 4 colores, se muestra una secuencia prendiendo luces y luego el usuario debe repetir esa secuencia.
Estoy teniendo como problema que me muestra dos o tres luces (según la secuencia randómica) pero no secuencialmente sino que encienden y apagan todas juntas, al mismo tiempo. Yo preciso que prenda una, se apague, se prenda la segunda, se apague, se prenda la tercera, se apague y así.

Creo que es un problema con el setTimeout, les paso mi código por si pueden ayudarme, estaría muy agradecida!!!

Código:
function jugar() { 
// Asigna los valores randómicos al array 
for(n=0;n<=multi;n++) { 
//multi es definida antes según el nivel de juego seleccionado niveles[niveles.length]= parseInt(Math.random()*4)+1 
if(niveles[n]==1){ 
window.setTimeout('mostrarRojo()',1000); } 
else if(niveles[n]==2){ 
window.setTimeout('mostrarAmarillo()',1000); } 
else if(niveles[n]==3){ window.setTimeout('mostrarAzul()',1000); } 
else{ window.setTimeout('mostrarVerde()',1000); } 
} 
}
Y por otro lado tengo el código con las correspondientes funciones:

Código:
 
function mostrarRojo(){ 
$("#c1").html('<img src="imagenes/rojo.png">'); window.setTimeout(apagoRojo,1000); } 
function ocultarRojo(){ $("#c1").html('<img src="imagenes/rojoApagado.png">'); } 
function mostrarAmarillo(){ 
$("#c2").html('<img src="imagenes/amarillo.png">'); window.setTimeout(apagoAmarillo,1000); } 
function ocultarAmarillo(){ 
$("#c3").html('<img src="imagenes/amarilloApagado.png">'); } 
function mostrarAzul(){ 
$("#c3").html('<img src="imagenes/azul.png">'); window.setTimeout(apagoAzul,1000); } 
function ocultarAzul(){ 
$("#c3").html('<img src="imagenes/azulApagado.png">'); } 
function mostrarVerde(){ 
$("#c4").html('<img src="imagenes/verde.png">'); window.setTimeout(apagoVerde,1000); }
function ocultarVerde() { 
$("#c4").html('<img src="imagenes/verdeApagado.png">'); }
Agradezco mucho si pueden orientarme!!!!!
Saludos :)
  #2 (permalink)  
Antiguo 24/06/2014, 11:14
Avatar de stock  
Fecha de Ingreso: junio-2004
Ubicación: Monterrey NL
Mensajes: 2.390
Antigüedad: 20 años, 4 meses
Puntos: 53
Respuesta: Secuencia de luces con setTimeout?

Tu problema es que en el timeout le estás asignando el mismo tiempo a todos, deberías hacer algo como

Código Javascript:
Ver original
  1. setTimeout(mostrarRojo,i * 1000);

Al multiplicar 100 * i lograrás tener la secuencia, ya que el valor de i es variable.

Saludos

Etiquetas: funcion, html, javascript, luces, secuencia, valor
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 09:27.