Código
const margen = 0.1; $(document).on("scroll", function() { if(margen > $(document).height() - $(window).scrollTop() - $(window).height()) { alert('ejecutado'); } }
Este código funciona con algunos errores y es que dependiendo de algunas resoluciones no se ejecuta nada.. Por supuesto quizás esta demás decir que estas resoluciones son de altura no de ancho... si yo achico la altura de la pestaña de la pagina se verá afectado el funcionamiento de el scroll. Algo que no quiero ya que sin importar que resolución se use quiero que el sistema funcione lo más optimo posible.
Intente cambiando el margen de error de 0.1 como estaba especificado originalmente a 0.5 y anduvo en la resolución deseada pero en otras resoluciones quizás o no funciona o se repite la ejecución varias veces algo muy raro.
Tampoco se si lo ideal sería ir probando de 0.1 a el 0.5 es decir, 0.2, 0.3 y 0.4 hasta encontrar el equilibrio ya que no se si en otras computadores/dispositivos esto funcionaría correctamente.
Estuve probando por mi cuenta los valores manejados a ver si encontraba algo inusual pero la verdad algo inusual no encuentro o mejor dicho no tengo idea que es lo que podría suceder.
Las pruebas las hice así
Código
const margen = 0.5; $(document).on("scroll", function() { var document_height = $(document).height(); var window_scroll_top = $(window).scrollTop(); var window_height = $(window).height(); console.log('$(document).height() = '+document_height+' | $(window).scrollTop() = '+window_scroll_top+' | $(window).height() = '+window_height); console.log('margen > $(document).height() - $(window).scrollTop() - $(window).height()'); console.log(margen+' > ('+document_height+' - '+window_scroll_top+' - '+window_height+')'); console.log(margen+' > ('+(document_height - window_scroll_top - window_height)+')'); if(margen > $(document).height() - $(window).scrollTop() - $(window).height()) { alert('ejecutado'); } });
Muchas gracias desde ya!