gpt4 book ai didi

jquery - 有效检测兄弟元素何时重叠

转载 作者:行者123 更新时间:2023-12-03 22:35:22 25 4
gpt4 key购买 nike

示例:

<div id="big">&nbsp;</div>
<div class="small">&nbsp;</div>
<div class="small">&nbsp;</div>
<div class="small">&nbsp;</div>
<div class="small">&nbsp;</div>
<div class="small">&nbsp;</div>
<!-- ...and so on -->

“#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.left+$big.outerWidth() &&
$thisPos.top >= $bigPos.top &&
$thisPos.top <= $bigPos.top+$big.outerHeight()
) smallArray.push($this);
});

...但这看起来很笨拙。我是否错过了 jQuery 的一些方法或普通 JavaScript,这将允许我以更优雅的方式做到这一点&高效的方式?

提前感谢您提供的任何帮助。

最佳答案

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

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;
}

Here is a POC.

This SO question对解决这个问题很有帮助。

关于jquery - 有效检测兄弟元素何时重叠,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/1560926/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com