Asked by L

I want to make my traffic lights run automatically without any user input. I have created this code so far but the images don't show up please help. My code:
<!DOCTYPE html>
<html>
<head>
<script type="text/javascript">
var lights=["red.jpg","redamber.jpg","green.jpg","amber.jpg"]
var lightscentre= 0;
var timer;
function LightCycle()
{
if(++lightscentre==4)
lightscentre=0

document.getElementById("red").setAttribute("src",lights[lightscentre]);
timer = setTimeout("LightCycle()",1000);
}
function stopCycle()
{
clearTimeout(timer);
}
</script>
</head>
<body>
<img src="red.jpg" name="red" id="red" width=130 height=175>

<form>
<input type="button" value="Cycle" name="Cycle" onclick="LightCycle()">
<input type="button" value="Stop" name="Stop" onclick="stopCycle()">
</form>
</body>
</html>
Answered by Leo
Does the first red image show up on pageload? If not, then you know the problem is not with the JavaScript.
Answered by L
When I run the code an outline of the image is shown but the images do not appear?
There are no AI answers yet. The ability to request AI answers is coming soon!