检测页面从顶部滚动的距离jquery

Question

如何检测浏览器窗口滚动的像素数？我需要这个来动态调整高度为100%的div...

我正在使用jQuery。

编辑：我不能仅仅使用scrollTop()，因为我正在使用一个高度为100％、溢出设置为自动的div。Firefox由于这个原因无法检测浏览器滚动，唯一滚动的是一个100％ x 100％的div...

- Jorre

Answer 1

使用 $(document).scrollTop()：

$(document).scroll(function() {
    console.log($(document).scrollTop());
})

- David Hellsing

---

谢谢你的帮助，但是我的控制台没有任何输出。我正在使用Firefox 3.5.7。似乎它没有响应事件。 - Jorre

在Safari和Chrome中触发了事件，但在Firefox或IE中没有。 - Jorre

我认为我知道问题出在哪里了。我使用了高度100%的实现，并将溢出设置为自动。我猜它没有检测到窗口滚动，而是溢出div中的滚动，可能吗？ - Jorre

@Jorre：当然可以。尝试用您的 div 选择器替换 document。 - David Hellsing

Answer 2

您可以使用scrollTop()方法来确定页面向下滚动了多少。

$(window).scroll(function() {
  console.log($(window).scrollTop());
  if ($(window).scrollTop() > 200) {
    $('#div').stop().animate({
      'marginTop': $(window).scrollTop() + 'px',
      'marginLeft': $(window).scrollLeft() + 'px'
    }, 'slow');
  }
});

- thecraighammond

---

我不得不修改上面的脚本，以便它能够与滚动 DIV 一起使用。我必须将其编码为 parseInt($("#container").scrollTop())，以便结果值能够被评估为整数。 - SukieC

Answer 3

好的，大家听我说：我找到了它：

$("div#container").scroll(function() {
         var screenheight = parseInt($(document).height());
         var scrolledpx = parseInt($("div#container").scrollTop());     
         var sum = screenheight+scrolledpx;
         console.log($("div#container").scrollTop());
         console.log("screen: " + screenheight);
         console.log("sum=" + sum);
         $("div.content").height(sum);
})

- Jorre

Answer 4

$(document).ready(()=> {
  $(window).scroll(function() {
    console.log($(window).scrollTop());
  })
}

- fruitloaf