Вам нужно понять три элемента DOM, а именно: ClientHeight, OffSetheight, Scrolltop.
ClientHeight: высота этого элемента занимает высоту всего пространства. Следовательно, если у Div есть полоса прокрутки, эта высота не включает содержание следующей части, которую не отображает полоса прокрутки. И это просто высота дивирования.
OffSetheight: относится к высоте содержания элемента. В соответствии с вышеизложенным, эта высота является высотой внутри Div, включая видимую часть и невидимую часть под стержнем прокрутки.
Scrolltop: Что это? Это можно понять как длину стержня прокрутки, которую можно прокрутить.
Например, если высота DIV составляет 400px (то есть ClientHeight составляет 400), а содержание внутри - очень длинный список, а высота содержания составляет 1000px (то есть, выходящее на 1000). Таким образом, в видимой части мы видим, что содержание 400px и 1000px по -прежнему невидимо 600px. И эта невидимая часть - это то, что мы можем отобразить, потянув полосу прокрутки. Если прокрутка не тянет, Scrolltop составляет 0 в настоящее время. Если вы подтянете полос прокрутки внизу, будет отображаться нижняя часть списка. В настоящее время Scrolltop составляет 600. Следовательно, интервал значения Scrolltop составляет [0, 600]. Таким образом, это 600 можно понять как длину стержня прокрутки, которую можно прокрутить.
После понимания вышеупомянутой концепции. Легко сказать, прокручивается ли он вниз.
Во -первых, мы тянем к прокрутке, вытягиваем сверху вниз, а изменение - это значение Scrolltop, и это значение имеет интервал.
Этот интервал: [0, (OffSetheight - ClientHeight)]
То есть весь процесс прокрутки стержня, изменяется в диапазоне от 0 до (OffSetheight ClientHeight).
1. Судья прокрутки прокрутки внизу: scrolltop == (OffSetheight ClientHeight)
2. В пределах 50px от нижней части полосы прокрутки: (OffSetheight ClientHeight) Scrolltop <= 50
3. В пределах 5% от расстояния полосы прокрутки от нижней части: Scrolltop / (OffSetheight ClientHeight)> = 0,95
Как указано выше.
Если вы хотите поднять дно, автоматически загрузите контент. Просто зарегистрируйте мероприятие Scrollbar:
Кода -копия выглядит следующим образом:
scrollbottomtest = function () {
$ ("#sance"). scroll (function () {
var $ this = $ (это),
viewh = $ (this) .height (), // видимая высота
contenth = $ (this) .get (0) .scrollheight, // высота контента
scrolltop = $ (this) .scrolltop (); // высота прокрутки
// if (contenth - viewh - scrolltop <= 100) {// При достижении нижнего 100px загрузите новый контент
if (scrolltop/(contenth -viewh)> = 0,95) {// При достижении нижнего 100px загрузите новый контент
// Загрузите данные здесь ..
}
});
}
PS: Здесь я рекомендую инструмент онлайн -запроса о событиях JS, который суммирует широко используемые типы событий и функции функций JS:
Полный список событий и функций JavaScript:
http://tools.vevb.com/table/javascript_event