当滚动达到80％负载阿贾克斯(Load ajax when scroll reaches 80%)

我使用下面的代码时滚动条到达botttom这是工作，

if($(window).scrollTop() == $(document).height() - $(window).height()){

不过，我想，当我到达滚动不是100的70％AJAX被激发。

Answer 1:

提供当滚动到页面的底部你目前的检查是射击，你可以尝试一些基本的算术：

if ($(window).scrollTop() >= ($(document).height() - $(window).height())*0.7){
                                          //where 0.7 corresponds to 70% --^

确保添加检查，以不火多个同时Ajax请求，如果你没有了。

这是相当出了问题的范围，但如果你想如何防止被同时烧制的多个请求的例子：

声明一个全局变量，如processing 。

然后其纳入你的函数：

if (processing)
    return false;

if ($(window).scrollTop() >= ($(document).height() - $(window).height())*0.7){
    processing = true; //sets a processing AJAX request flag
    $.post("url", '<params>', function(data){ //or $.ajax, $.get, $.load etc.
        //load the content to your div
        processing = false; //resets the ajax flag once the callback concludes
    });
}

这是一个使用VAR跟踪，如果有适合您滚动功能或不活跃Ajax请求的一个简单的例子，它不与你可能有其他赞同Ajax请求干扰。

编辑：的jsfiddle例子

请注意，使用％来衡量原稿的高度可能是一个坏主意，考虑到文档的高度将每次加载一些时间增加，使得它触发Ajax请求，从页面的底部是相对更远（绝对尺寸明智的）。

我建议你使用（200-700左右）的固定值的偏移量，以防止：

if ($(window).scrollTop() >= $(document).height() - $(window).height() - 700){
                                 // pixels offset from screen bottom   --^

例如：的jsfiddle

编辑：要重现与百分比，负载50的第一个代码问题div s转换它。当加载下一div ，当滚动这2％回文件的高度的70％，这将增加，只有2％的总文档的高度，这意味着下一个请求将尽快启动。在我的固定实施例中，限定的底部偏移将加载只有当用户是在限定的绝对像素范围从屏幕的底部的新内容。

Answer 2:

快速谷歌搜索get percentage scrolled down带来了这个页面的第一个结果（用下面的代码，或多或少你想要做哪一个）。我觉得你没有问这里之前尝试任何研究。

$(document).scroll(function(e){

    // grab the scroll amount and the window height
    var scrollAmount = $(window).scrollTop();
    var documentHeight = $(document).height();

    // calculate the percentage the user has scrolled down the page
    var scrollPercent = (scrollAmount / documentHeight) * 100;

    if(scrollPercent > 50) {
        // run a function called doSomething
       doSomething();
    }

    function doSomething() { 

        // do something when a user gets 50% of the way down my page

    }

});