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