負載阿賈克斯80％

Question

我使用下面的代碼，其工作時的滾動條到達botttom，

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

但是我想，當我到達了滾動的70％的Ajax是解僱不是100.

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 example

請注意，用％來衡量原稿的高度可能是一個壞主意，考慮到文檔的高度將每次加載一些時間增加，使其成爲引發Ajax請求是相對更遠離頁面底部（絕對尺寸明智）。

我推薦使用（200-700左右）的固定值的偏移來防止：

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

實施例：JSFiddle

編輯：要重現的問題在所述第一代碼百分比，加載50 div。當您加載下一個div時，它只會將文檔總高度增加2％，這意味着只要將這2％滾動迴文檔高度的70％，就會觸發下一個請求。在我的固定示例中，只有當用戶處於距屏幕底部定義的絕對像素範圍時，定義的底部偏移量纔會加載新內容。

Answer 2

快速谷歌搜索get percentage scrolled down帶來了this page作爲第一個結果（與下面的代碼，或多或少做你想要的）。我感覺你在問這裏之前沒有嘗試過任何研究。

$(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 

    } 

});