Cómo comprobar si la barra de desplazamiento está en la parte inferior

Question

¿Cómo se puede comprobar si la barra de desplazamiento se encuentra en la parte inferior? Uso de JQuery o JavaScript

Answer 1

Encuentra la altura del contenedor desplazable y luego compara eso con la posición de desplazamiento. Si son lo mismo, entonces has llegado al final.

<div style="overflow: auto; height: 500px"> 
</div> 

$(document).ready(function() 
{ 
    $('div').scroll(function() 
    { 
     var div = $(this); 
     if (div.height() == div.scrollTop() + 1) //scrollTop is 0 based 
     { 
      alert('Reached the bottom!"); 
     } 
    }); 
}); 

Edit: una pequeña prueba en un jidid y me di cuenta de que la versión anterior es incorrecta. Puede utilizar una propiedad DOM para averiguar la cantidad de desplazamiento hay un realizar un poco de matemáticas con la altura del elemento al igual que

 var div = $(this); 
     if (div[0].scrollHeight - div.scrollTop() == div.height()) 
     { 
      alert('Reached the bottom!'); 
     } 

http://jsfiddle.net/Aet2x/1/

Answer 2

Puede comprobar si el elemento scrollTop es igual a el elemento innerHeight.

if($('div').scrollTop() == $('div').innerHeight()){ 
    //Reached the bottom 
} 

Answer 3

Esto funcionó para mí (con jQuery):

$(document).ready(function(){ 
    $('div').scroll(function(){ 
    //scrollTop refers to the top of the scroll position, which will be scrollHeight - offsetHeight 
    if(this.scrollTop == (this.scrollHeight - this.offsetHeight)) { 
     console.log("Top of the bottom reached!"); 
    } 
    }); 
}); 

Tomado de here.