当用户滚动“靠近”页面底部时,加载更多内容?

时间:2022-10-12 21:31:04

I use this to detect scroll to the bottom of page. But how do I detect a distance from the bottom of the page?

我用它来检测滚动到页面底部。但是如何检测页面底部的距离?

if($(window).scrollTop() + $(window).height() == $(document).height() ) {
 .. my ajax here
}

I mean i want the function to execute when he is 100px or 200px from the bottom, and not in the very bottom of page. How would I change this?

我的意思是我希望函数在从底部开始是100px或200px时执行,而不是在页面底部。我该如何改变?

Also: is it possible, to instead catch if the scroll is at the last of a specific element (say my big CONTAINER) which shows the loaded content.

另外:如果滚动位于显示加载内容的特定元素(比如我的大容器)的最后一个,则可能会捕获。

Thanks in advance

提前致谢

2 个解决方案

#1


15  

var nearToBottom = 100;

if ($(window).scrollTop() + $(window).height() > 
    $(document).height() - nearToBottom) { 
 .. my ajax here 
} 

or to scroll to the bottom of .CONTAINER

或者滚动到.CONTAINER的底部

if ($(window).scrollTop() + $(window).height() >= 
    $('.CONTAINER').offset().top + $('.CONTAINER').height() ) { 
 .. my ajax here 
} 

#2


5  

This will help you.

这对你有所帮助。

<script>
 $(window).scroll(function () {
    if ($(document).height() <= $(window).scrollTop() + $(window).height()) {
        alert("End Of The Page");
    }
 });
</script>

Go through this link for whole article and details how it works.

浏览此链接以查看整篇文章,并详细说明其工作原理。

load more content when browser scroll to end of page in jquery

当浏览器在jquery中滚动到页面末尾时加载更多内容

#1


15  

var nearToBottom = 100;

if ($(window).scrollTop() + $(window).height() > 
    $(document).height() - nearToBottom) { 
 .. my ajax here 
} 

or to scroll to the bottom of .CONTAINER

或者滚动到.CONTAINER的底部

if ($(window).scrollTop() + $(window).height() >= 
    $('.CONTAINER').offset().top + $('.CONTAINER').height() ) { 
 .. my ajax here 
} 

#2


5  

This will help you.

这对你有所帮助。

<script>
 $(window).scroll(function () {
    if ($(document).height() <= $(window).scrollTop() + $(window).height()) {
        alert("End Of The Page");
    }
 });
</script>

Go through this link for whole article and details how it works.

浏览此链接以查看整篇文章,并详细说明其工作原理。

load more content when browser scroll to end of page in jquery

当浏览器在jquery中滚动到页面末尾时加载更多内容