使用JavaScript进行碰撞检测。 （检查2个块级元素是否接触）

Question

我想检查我的div是否触摸了另一个div

这是我的作品

$(document).mousemove(function(event){
        if(getmouse){
            var newX= event.pageX-20;
            var newY= event.pageY-20;
            $('.mybox').css('left',newX + "px");
            $('.mybox').css('top',newY+ "px");
            var checkY = parseInt($('.box1').css('top').slice(0,-2));
            var checkX = parseInt($('.box1').css('left').slice(0,-2));
            var padingval = parseInt($('.box').css('padding').slice(0,-2))*2;
            console.log(checkY+padingval+" - "+newY);
            if((newY==checkY&&newX==checkX)||newY+20<checkY-padingval
               ||newY-20<checkY+padingval)
            {
                alert('Game Over');
                getmouse = false;
                $('.mybox').css('top',"240px");
                $('.mybox').css('left',"420px");
            }
        }
    })

http://jsfiddle.net/48m6rof6

如果我的div触及任何div它必须提醒游戏结束并返回其位置 我检查过它是否触及第一个盒子，但是有没有简单的方法可以检查？

Answer 1

您可以像这样使用Jquery collision plugin：

var x = $("#div1").collision(".div2");