碰撞
function isCrash(a, b) {
var l1 = a.offsetLeft;
var t1 = a.offsetTop;
var r1 = l1 + a.offsetWidth;
var b1 = t1 + a.offsetHeight;
var l2 =b.offsetLeft;
var t2 =b.offsetTop;
var r2 = l2 + b.offsetWidth;
var b2 = t2 + b.offsetHeight;
if (r2<l1 || b2<t1 || r1<l2 || b1<t2) {
// 不碰撞
return false;
} else {
// 碰撞
return true;
}
}
案例 飞机大战
var dHero = document.getElementById('hero');
var dEnemy = document.getElementById('enemy');
var dBullet = document.getElementById('bullet');
var dScore = document.getElementById('score');
var score = 0;
// 碰撞
function isCrash(a, b) {
var l1 = a.offsetLeft;
var t1 = a.offsetTop;
var r1 = l1 + a.offsetWidth;
var b1 = t1 + a.offsetHeight;
var l2 =b.offsetLeft;
var t2 =b.offsetTop;
var r2 = l2 + b.offsetWidth;
var b2 = t2 + b.offsetHeight;
if (r2<l1 || b2<t1 || r1<l2 || b1<t2) {
// 不碰撞
return false;
} else {
// 碰撞
return true;
}
}
// 检测
function check() {
var es = dEnemy.children;
var bs = dBullet.children;
// enemy和hero
for (var i=0; i<es.length; i++) {
var e = es[i];
if (isCrash(dHero, e)) {
alert('gameover!')
}
// enemy和bullet
for (var j=0; j<bs.length; j++) {
var b = bs[j];
if (isCrash(e, b)) {
// 子弹消失
dBullet.removeChild(b);
// 敌机消失
dEnemy.removeChild(e);
score ++;
dScore.innerHTML = '得分:' + score;
// 处理数据
i --;
break;
}
}
}
}