Загрузите ajax, когда свиток достигает 80%

Ответ 1

Если ваша текущая проверка срабатывает при прокрутке до нижней части страницы, вы можете попробовать некоторые основные арифметики:

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

Обязательно добавьте проверку, чтобы не запускать несколько одновременных запросов Ajax, если вы этого еще не сделали.

Это скорее выходит за рамки вопроса, но если вам нужен пример того, как предотвратить одновременное увольнение нескольких запросов:

Объявить глобальный var, например. 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. Когда вы загрузите следующий div, он добавит только 2% к общей высоте документа, что означает, что следующий запрос будет запущен, как только вы прокрутите эти 2% обратно до 70% высоты документа. В моем фиксированном примере определенное нижнее смещение загружает новое содержимое только тогда, когда пользователь находится в определенном абсолютном диапазоне пикселей от нижней части экрана.

Ответ 2

Быстрый поиск google для 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

    }

});