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

Question

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

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

Answer 1

您可以尝试jquery-collision和jquery-ui-draggable-collision。完全披露：我刚刚在sourceforge上编写并发布了这些内容。第一个允许这个：var hit_list = $("#collider").collision(".obstacle");这是与“#collider”重叠的所有“.obstacle”的列表。第二个允许：$("#collider").draggable( { obstacle: ".obstacle" } );这给你（除其他外）一个“碰撞”事件绑定到：$("#collider").bind( "collision", function(event,ui){...} );你甚至可以设置：$("#collider").draggable( { obstacle: ".obstacle", preventCollision: true } );防止“#collider”在拖动时重叠任何“.obstacle”。

Answer 2

在原生Javascript中var&nbsp;is_colliding&nbsp;=&nbsp;function(div1,&nbsp;div2)&nbsp;{ &nbsp;&nbsp;var&nbsp;d1_height&nbsp;=&nbsp;div1.offsetHeight; &nbsp;&nbsp;var&nbsp;d1_width&nbsp;=&nbsp;div1.offsetWidth; &nbsp;&nbsp;var&nbsp;d1_distance_from_top&nbsp;=&nbsp;div1.offsetTop&nbsp;+&nbsp;d1_height; &nbsp;&nbsp;var&nbsp;d1_distance_from_left&nbsp;=&nbsp;div1.offsetLeft&nbsp;+&nbsp;d1_width; &nbsp;&nbsp;var&nbsp;d2_height&nbsp;=&nbsp;div2.offsetHeight; &nbsp;&nbsp;var&nbsp;d2_width&nbsp;=&nbsp;div2.offsetWidth; &nbsp;&nbsp;var&nbsp;d2_distance_from_top&nbsp;=&nbsp;div2.offsetTop&nbsp;+&nbsp;d2_height; &nbsp;&nbsp;var&nbsp;d2_distance_from_left&nbsp;=&nbsp;div2.offsetLeft&nbsp;+&nbsp;d2_width; &nbsp;&nbsp;var&nbsp;not_colliding&nbsp;= &nbsp;&nbsp;&nbsp;&nbsp;d1_distance_from_top&nbsp;<&nbsp;div2.offsetTop&nbsp;|| &nbsp;&nbsp;&nbsp;&nbsp;div1.offsetTop&nbsp;>&nbsp;d2_distance_from_top&nbsp;|| &nbsp;&nbsp;&nbsp;&nbsp;d1_distance_from_left&nbsp;<&nbsp;div2.offsetTop&nbsp;|| &nbsp;&nbsp;&nbsp;&nbsp;div1.offsetLeft&nbsp;>&nbsp;d2_distance_from_left; &nbsp;&nbsp;return&nbsp;!not_colliding;};