javascript - content - pagination js ejemplo

Determinar cuándo desplazarse al final de una página con Javascript

Question

Estoy tratando de determinar cuándo me he desplazado a la parte inferior de la página (sin usar ninguna biblioteca de JS), pero hasta ahora estoy un poco confundido sobre cuál de los siguientes usar. El más prometedor que he visto es window.scrollY , pero incluso cuando se desplaza al final de la página, nunca coincide con el valor de window.innerHeight . ¿Cuál es la mejor manera de hacer esto?

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

Al ser una persona perezosa en el fondo, pondría un elemento en la parte inferior del DIV, y aplicaría el complemento jQuery " elemento a la vista " en él. (Descargo de responsabilidad: no tengo experiencia propia con él, pero se ve bien).

Una ligera variación del ejemplo de la entrada del blog:

$(''#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 2

Esto funciona bien:

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

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

Answer 3

cuando window.innerHeight + document.body.scrollTop es mayor o igual que document.body.offsetHeight entonces estás en la parte inferior

pero como IE tiene problemas con estas propiedades, necesita usar propiedades alternativas, como

document.documentElement.scrollTop para el desplazamiento y document.documentElement.clientHeight para la altura de la ventana

Código completo: http://jsbin.com/egegu3/6/edit