jquery - 如何检测两个 div 是否与 jquery 接触？

Question

我正在开发一个带有两个 div 的简单气球游戏。问题是当两个 div 相互接触时我无法触发功能。

Answer 1

您正在寻找边界框碰撞检测。如果你想引发一个事件，你必须反复测试，但最好只在游戏循环中对所有游戏对象运行该函数。沙盒位于 http://jsfiddle.net/nGRwt/7/

  function collision($div1, $div2) {
      var x1 = $div1.offset().left;
      var y1 = $div1.offset().top;
      var h1 = $div1.outerHeight(true);
      var w1 = $div1.outerWidth(true);
      var b1 = y1 + h1;
      var r1 = x1 + w1;
      var x2 = $div2.offset().left;
      var y2 = $div2.offset().top;
      var h2 = $div2.outerHeight(true);
      var w2 = $div2.outerWidth(true);
      var b2 = y2 + h2;
      var r2 = x2 + w2;

      if (b1 < y2 || y1 > b2 || r1 < x2 || x1 > r2) return false;
      return true;
    }