What I would like to know when the user sees the main view of my application and it reaches the end, the footer should appear in a colorful way, I currently have several lines of code in juqery that should send me an alert when I arrive in the end, but it does the opposite and sends me the alert when I'm up.
Current code:
$(window).scroll(function() {
if($(window).scrollTop() + $(window).height() == $(document).height()) {
alert("END!");
}
});
What happens is that the value of $(window).scrollTop() is not exact so when adding the high $(window).height() of the window will not give the high $(document).height() of the document, I recommend you handle it with a margin of error.
Example:
const MARGEN = .1;
$(function(){
$(window).on("scroll",endPage)
})
function endPage(){
if(MARGEN > $(document).height() - $(window).scrollTop() - $(window).height()) {
console.log("Fin de la Pagina");
}
}#divID {
height:1000px;
}<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="divID"></div>