当兄弟元素重叠时有效检测

例：

“#big”绝对位于“.small”的一部分后面，但不是父元素。

我一直这样做：

  var smallArray = []; var $big = $('#big'); var $bigPos = $big.offset(); $('div.small').each(function() { var $this = $(this); var $thisPos = $this.offset(); if( $thisPos.left >= $bigPos.left && $thisPos.left = $bigPos.top && $thisPos.top <= $bigPos.top+$big.outerHeight() ) smallArray.push($this); }); 

……但这似乎很糟糕。 我错过了一些jQuery或vanilla JavaScript方法，这些方法可以让我以更优雅高效的方式做到这一点吗？

在此先感谢您提供的任何帮助。

Answer 1

此公式将检测是否有任何指定元素与目标元素重叠：

 function findIntersectors(targetSelector, intersectorsSelector) { var intersectors = []; var $target = $(targetSelector); var tAxis = $target.offset(); var t_x = [tAxis.left, tAxis.left + $target.outerWidth()]; var t_y = [tAxis.top, tAxis.top + $target.outerHeight()]; $(intersectorsSelector).each(function() { var $this = $(this); var thisPos = $this.offset(); var i_x = [thisPos.left, thisPos.left + $this.outerWidth()] var i_y = [thisPos.top, thisPos.top + $this.outerHeight()]; if ( t_x[0] < i_x[1] && t_x[1] > i_x[0] && t_y[0] < i_y[1] && t_y[1] > i_y[0]) { intersectors.push($this); } }); return intersectors; } 

这是一个POC。

这个问题非常有助于解决这个问题。