<html>
<canvas id="canvas" height=150 width=500></canvas>
<br>
<input type="text" id="val">
<script>
var x_1 = 0;
var x_2 = 0;
var x_3 = 0;
var mach = 0;
var timerId = setInterval(function() {
var canvas = document.getElementById('canvas');
var ctx = canvas.getContext('2d');
ctx.clearRect(0,0,500,500);
ctx.fillStyle = "orange";
rn = Math.floor(Math.random()*3);
if (rn == 0) x_1 = x_1 + 25;
if (rn == 1) x_2 = x_2 + 25;
if (rn == 2) x_3 = x_3 + 25;
ctx.fillRect(x_1,0,100,25);
ctx.fillRect(x_2,50,100,25);
ctx.fillRect(x_3,100,100,25);
if (x_1 == 400 )
{
mach = 1;
clearInterval(timerId);
}
if (x_2 == 400 ){
mach = 2;
clearInterval(timerId);
}
if (x_3 == 400 )
{
mach = 3;
clearInterval(timerId);
}
finish = document.getElementById("val").value;
if (x_1 == 400 || x_2 == 400 || x_3 == 400)
{
if (finish == mach)
alert("вы угадали "+" машина номер "+mach+" приехала первой");
else
alert("вы не угадали "+" машина номер "+mach+" приехала первой");
}
}, 200);
</script>
<body>
</html>
| 