Налетай! проверь свою реакцию набери
10 из
10 точных кликов!!! У Вас только
полсекунды на клик.
<!DOCTYPE HTML>
<html>
<head>
<title></title>
<style type="text/css">
td{
width: 50px;
height: 50px;
background-color: #FF00FF;
}
.activ{
background-color: #00FFFF;
}
</style>
<script src="https://code.jquery.com/jquery-latest.js"></script>
<script language="JavaScript" type="text/javascript">
$(function () {
var mytable = $('<table/>', {
'class': 'mytable'
})
var a = new Array(10);
$.each(a, function () {
var Cell = $('<tr/>');
$.each(a, function () {
Cell.append($('<td/>'));
});
$(mytable).append(Cell);
});
$('.content').append(mytable);
$('.mytable td').click(function () {
if (!n) return;
$(this).removeClass('activ')
});
var n = 0,
timer;
$('.but').click(function () {
if (n) return;
$('.mytable td').removeClass('activ')
n = 10; //сколько кликов
show()
});
function show() {
window.clearTimeout(timer)
var k = $('.mytable td:not(.activ)').length;
if (n == 0) {
k = 10 - $('.mytable td.activ').length;
alert(k + '/10');
return
}
k = Math.round((k-1)*Math.random())
$('.mytable td:not(.activ)').eq(k).addClass('activ');
n--;
timer = setTimeout(show, 500);
}
});
</script>
</head>
<body>
<div class="content" >
</div>
<input type="button" name="" value="start" class="but" />
</body>
</html>