2013-04-15 37 views
0

首先的滚动高度,我想知道这方面的区别:获取页面

- $(window).height() 

- $(document).height() 

- $(window).scrollTop() 

这些条款看上去有点类似于我,我无法理解他们之间的明显差异。这里是我的答案:

  • $(window).height():提供窗口,用户可以看到的高度。

  • $(document).height():给出文档的总高度。根据页面上的内容,这可以高于/低于窗口高度。

  • $(document).scrollTop():给出窗口中滚动条的垂直位置。

真正的问题: 我想实现懒加载有点事,我需要打电话到服务器时滚动条已经从页面底部交叉点200像素。我无法使用上述值来获得此。

任何帮助,将不胜感激。

回答

0

最后,我想通了,什么应该理解这些条款后计算。感谢答案。我的定义几乎是正确的。

function (isScrollable) { 
    var isUserAtBottom = ($(window).height() + $(window).scrollTop() + 200 > $(document).height()); 
    if (isUserAtBottom) { 
    // Do something (Like Ajax call to server to fetch new elements) 
    return true; 
    } 
} 
+1

这与我的回答基本相同。 – Bill

3

窗口是您可以看到的区域 - 就好像您的屏幕是一个窗口,并且您正在浏览文档。文档是整个文档 - 它可能比窗口更短或更长。

这是你需要数学:

if($(document).height() - $(document).scrollTop() < 200){ 
    //Do something 
} 
1
$(window).height(); // returns height of browser viewport 
$(document).height(); // returns height of HTML document 
$(window).scrollTop(); //Get the current vertical position of the scroll bar for the first    element in the set of matched elements or set the vertical position of the scroll bar for every matched element. 

$(window).scrollHeight(); //Height of the scroll view of an element; it includes the element padding but not its margin. 
+0

'$(window).scrollHeight()'那是什么? – yckart