0

我有一个令人沮丧的问题，我不知道如何解决。

我的问题：如何确定视口中两个位置之间存在多少个元素（在这种情况下是可滚动的 div）？

假设我有<div>一个高度为 150 像素的可滚动，但有一个 450 像素的视口，其中大部分都被隐藏了。div 有 30px 高的孩子，其中 15 个。

问题 2：我怎样才能找出 n1 和 n2 之间存在多少个第一个孩子，这似乎很容易，但事实证明并非如此。

我创建了一个jsFiddle，我在其中部分解决了解决方案，如果将 top 值设置为 0，它会起作用，但如果是其他任何东西，它就不起作用。例如，通过这个解决方案，我能够确定在 0 到 200px 之间有 7 个可见的 div。但是如果我改变它来确定有多少在 30px 和 230px 之间，它会告诉我 0，什么时候应该是 7。

请帮忙！

4

2 回答 2

2

试试这个：

var $this = $(this),
    topOffset = $this.offset().top;
if (topOffset >= top && topOffset <= bottom) {
    elements++;
}

这将检查当前元素（在 中each()）的顶部偏移量是否大于top变量的值，elements然后才增加。这样，您就不需要不断更新height变量。

正如您在此处看到的那样，这很有效。

于 2012-08-07T17:23:51.770 回答
2

更改它，使“高度”开始等于顶部值。

你的 javascript 应该是：

var container = $('div#container'),
top = 30,
bottom = 230,
height = top,
elements = 0;

container.find('div').each(function(n)
{
  if (top <= height && height < bottom)
{
    height = height + $(this).height();
    elements++;
    console.log(top, bottom, height, elements);
}
});

$('span.top').text(top);
$('span.btm').text(bottom);
$('span.num').text(elements);

这对我有用，祝你好运！

于 2012-08-07T17:24:22.463 回答