Здравствуйте. Я для курсовой делаю что-то типа игры. Ездиет объект, и собирает другие объекты. И вот проблема : объект ездиет, поинты появляются. Но как брать их? Чтобы они пропадали при наезде на них объектом...у меня не получилось... И как мне еще сделать таймер и счетчик очков. И вообще посоветуйте что-нибудь для улучшения наглядности сей игры. Заранее спасибо!
<!DOCTYPE html>
<html>
<head>
<title></title>
<script type="text/javascript">
var Wp, Hp;
var dL = dU = dR = dB = 0;
var L = 123; T = 234; S = 15;
var nL = false, nT = false;
onload = function ()
{
var CW = document.body.clientWidth;
Wp = .8 * CW, Hp = .75 * Wp;
document.getElementById ('pole').style.width = Wp + 'px';
document.getElementById ('pole').style.height = Hp + 'px';
document.body.onkeydown = function (ev)
{
var e = window.event || ev, K = e.keyCode;
if (K == 37) dL = -S;
else if (K == 38) dU = -S;
else if (K == 39) dR = S;
else if (K == 40) dB = S;
}
document.body.onkeyup = function (ev)
{
var e = window.event || ev, K = e.keyCode;
if (K == 37) dL = 0;
else if (K == 38) dU = 0;
else if (K == 39) dR = 0;
else if (K == 40) dB = 0;
}
function move1 ()
{
var p = 'px', O = document.getElementById ('img').style;
L += dL + dR, T += dU + dB;
if (L < 0) L = 0; if (L > (Wp - 60)) L = Wp - 60;
if (T < 0) T = 0; if (T > (Hp - 60)) T = Hp - 60;
O.left = L + p; O.top = T + p;
setTimeout (move1, 100);
}
function coin() {
var B = document.getElementById('coin').style;
var Lk=Math.random()*Wp, Tk=Math.random()*Hp;
B.left = Lk + 'px';
B.top = Tk + 'px';
B.visibility = 'visible';
setTimeout(coin, 6000);
setTimeout(hide, 3000);
if(Tk == T|| Tk - 40 == T || Lk == L || Lk - 24 == L) {hide(1); coin();}
function hide(n) {
n=n||10;
if (n==1) { B.visibility='hidden';return;}
n--;
B.visibility = B.visibility=='hidden'?'visible':'hidden';
setTimeout(function() {hide(n);},200);
}
}
coin ();
move1 ();
}
</script>
</head>
<body>
<div id="pole" style="width : 400px; height : 300px; position : relative; background : #e5e5e5; border : 5px solid #000;">
<div id="img" style="position: absolute; z-index: 999; left: 123px; top: 234px; width : 60px; height : 60px; background: black;"></div>
<div id="coin" style="position: absolute; z-index: 99; left: 123px; top: 234px; visibility : hidden; width : 30px; height : 30px; background: gray;"></div>
</div>
</body>
</html>
Вот, и у меня моргающий объект иногда за рамку выпрыгивает...как это исправить?