Queria hacer un semaforo que cuando pinchase un boton se pusiera rojo lo pulso de nuevo y se pone amarillo lo pulso de nuevo y se pone verde y lo pulso de nuevo y se pone rojo y vuelta a empezar
yo habia pensado en este codigo pero no se por que no funciona:
Código:
ese es el codigo de la función y este el de la pagina completafunction semaforo() { var variable1=document.getElementById('arriba') var variable2=document.getElementById('medio') var variable3=document.getElementById('abajo') if (variable2.src.match("semaforo_apagado.png") && variable3.src.match("semaforo_apagado.png")) { variable1.src="semaforo_rojo.png"; } else if (variable1.src.match("semaforo_rojo.png")) { variable2.src="semaforo_amarillo.png"; } else { } }
Código:
El semaforo se pone en rojo una vez que pincho en el boton pero pincho de nuevo y no se pone en amarillo. por que le digo si estan apagados las dos imagenes de abajo la de arriba se pone roja vale y luego le digo si la imagen de arriba está roja la del medio se pone amarilla pero eso no lo hace ;(<html> <head> <title>ejercicio avanzado</title> </head> <script> function semaforo() { var variable1=document.getElementById('arriba') var variable2=document.getElementById('medio') var variable3=document.getElementById('abajo') if (variable2.src.match("semaforo_apagado.png") && variable3.src.match("semaforo_apagado.png")) { variable1.src="semaforo_rojo.png"; } else if (variable1.src.match("semaforo_rojo.png")) { variable2.src="semaforo_amarillo.png"; } else { } } </script> <body> <center> <img id="arriba" src="semaforo_apagado.png" width="190" height="190"></img> <br/> <img id="medio" src="semaforo_apagado.png" width="190" height="190"></img> <br/> <img id="abajo" src="semaforo_apagado.png" width="190" height="190"></img> <br/> <button onclick="semaforo()">cambiar semaforo</button> </center> </body> </html>
*posdata son tres imagenes una encima de la otra simulando un semaforo
[url=http://es.zimagez.com/zimage/semaforoapagao.php][img]http://es.zimagez.com/miniature/semaforoapagao.bmp[/img][/url]
[url=http://es.zimagez.com/zimage/semaforoapagao.php]apagado[/url]
http://es.zimagez.com/zimage/semaforoapagao.php
aqui cuando le doy al boton y se pone rojo:
[url=http://es.zimagez.com/zimage/semaforoencendio.php][img]http://es.zimagez.com/miniature/semaforoencendio.bmp[/img][/url]
[url=http://es.zimagez.com/zimage/semaforoencendio.php][/url]
http://es.zimagez.com/zimage/semaforoencendio.php
lo malo es que al seguir dandole no cambia a amarillo por eso no he hecho el verde por que primero tiene que pasar a amarillo