jQuery: обнаружение достигающей нижней части прокрутки не работает, только обнаруживает вершину
Таким образом, в основном моей проблемой является на вид простая.
Вы видите его в действии по http://furnace.howcode.com (обратите внимание на то, что, данные возвращаются через Ajax, поэтому если ничего не происходит, дают ему несколько моментов!).
То, что ПРЕДНАЗНАЧЕНО для случая, находится во втором столбце, когда Вы добираетесь до нижней части прокрутки, следующие 5 результатов возвращаются.
Но то, что на самом деле происходит, является этим, только возвращает 5 результатов, когда Вы поражаете TOP области прокрутки.Попробуйте: прокрутите вниз, ничего не происходит. Прокрутите назад до вершины, результаты возвращаются.
Что идет не так, как надо?
Вот мой код, который я использую:
$('#col2').scroll(function(){
if ($('#col2').scrollTop() == $('#col2').height() - $('#col2').height()){
loadMore();
}
});
loadMore(); функция, которая получает данные и добавляет их.
Таким образом, что идет не так, как надо здесь?Спасибо за помощь!
3 ответа
Ваша математика неверна, вы говорите, что если положение полосы прокрутки равно высоте колонки минус высота колонки (что равно нулю), то загрузите больше. вот почему ваш loadMore() вызывается в верхней части колонки.
Try:
$('#col2').scroll(function(){
if ($('#col2').scrollTop() == $('#col2').height()){
loadMore();
}
});
Решение, которое опубликовал jordanstephens, находится на правильном пути. Однако вам нужна не высота # col2, вам нужна высота родительского элемента # col2.
Пример:
$('#col2').scroll(function(){
if ($('#col2').scrollTop() == $('#col2').parent().height()) {
loadMore();
}
}
Это сработало для меня в прошлом.
var col = $('#col2');
col.scroll(function(){
if (col.outerHeight() == (col.get(0).scrollHeight - col.scrollTop()))
loadMore();
});
Вот хорошее объяснение тоже.