Определение при прокрутке до нижней части страницы с помощью Javascript

Question

Я пытаюсь определить, когда я прокрутил до конца страницы (без использования какой-либо библиотеки JS), но пока что я немного запутался, какой из следующих вариантов использовать. Самым многообещающим из всех, что я видел, является window.scrollY, но даже при прокрутке вниз страницы он никогда не будет соответствовать значению window.innerHeight. Какой лучший способ сделать это?

window.innerWidth
window.innerHeight

window.outerWidth
window.outerHeight

window.scrollX
window.scrollY

document.body.scrollWidth
document.body.scrollHeight
document.body.scrollTop
document.body.scrollLeft

document.body.offsetTop
document.body.offsetLeft
document.body.offsetWidth
document.body.offsetHeight

Answer 1

, когда window.innerHeight + document.body.scrollTop больше или равно document.body.offsetHeight, тогда вы находитесь внизу

но, поскольку IE имеет проблемы с этими свойствами, вам нужно использовать альтернативные свойства, такие как

document.documentElement.scrollTop для прокрутки и document.documentElement.clientHeight для высоты окна

полный код: http://jsbin.com/egegu3/6/edit

Answer 2

Будучи ленивым человеком в глубине души, я бы поместил элемент в самый низ DIV и применил к нему плагин jQuery " view"". (Отказ от ответственности: у меня нет собственного опыта, но это выглядит хорошо.)

Небольшое изменение примера из записи в блоге:

$('#bottomDIV').bind('inview', function (event, visible) {
  if (visible == true) {
    // element is now visible in the viewport
    highlightButtons(); // or whatever you want to do in the context
  }
});

Answer 3

Это прекрасно работает:

 window.onscroll = function()
 {
    var scrollHeight, totalHeight;
    scrollHeight = document.body.scrollHeight;
    totalHeight = window.scrollY + window.innerHeight;

    if(totalHeight >= scrollHeight)
    {
        console.log("at the bottom");
    }
}