Divs之间的碰撞检测

我遇到了一些麻烦与我简单的砖破碎机游戏。我为我的球对象制作了一个简单的动画，但我很难用它来检测它何时与页面上的其他元素接触。更何况，我似乎无法让我的播放器不能移出我为它制作的容器div。我只想让球从球员桨，墙壁和砖块上反弹回来。Divs之间的碰撞检测

$(function(){ 
$(document).keydown(function(e){ 
    var Playerposition = $("#player").position(); 
    var Ballposition = $("#ball").position(); 
    switch (e.keyCode){ 
     case 37: //Left Movement 
      $("#player").css('left', Playerposition.left - 20 + 'px'); 
     break; 
     case 39://Right movement 
      $("#player").css('left', Playerposition.left + 20 + 'px'); 
     break; 
    } 
}); 
var top = 275; 
var left = 325; 
var interval = 5; // time interval in milliseconds 
var increment = 1; 
var move = function() { 
    if(left > 750) { 
     increment = -increment; 
    } 
    if(left < 0) { 
     increment = -increment 
    } 
    if(top > 325){ 
    increment = -increment; 
    } 
    if(top < 0) { 
    increment = -increment; 
    } 
    top = top + increment; 
    left = left + increment; 
    $('#ball').css('left', left + 'px'); 
    $('#ball').css('top', top + 'px'); 
}; 
setInterval(move, interval)});

我已经安装了gameQuery，以及jquery。这是我目前用我目前的html/css/javascript的游戏：jfiddle对不起，它匹配得很好，它看起来很好，完整的网页。

来源

2014-01-12 user3186869