Checking if scroll is at bottom in jquery in Google Chrome

Viewed 70

I have django project and I can't make jquery script to run in google chrome.

Simple code for checking if scroll is at bottom:

 <script language="JavaScript" type="text/JavaScript">
    window.onload = function () {

       $('#scrolling').on('scroll', chk_scroll);
    };

    function chk_scroll(e) {

        var elem = $(e.currentTarget);
        if (elem[0].scrollHeight - elem.scrollTop() == elem.outerHeight()) {
           alert("bottom")
        }
    }
</script>

It works in Opera, Explorer, Firefox, Chrome (As single html file, not part of project), jsfiddle.

P.s jquery loads correctly and other scripts works.

1 Answers

Try the following:

$( window ).on( 'scroll', checkScroll );


function checkScroll()
{
    const documentScrollTop     = $( document ).scrollTop();
    const documentOuterHeight   = $( document ).outerHeight();
    const windowOuterHeight     = $( window ).outerHeight();

    if ( documentScrollTop >= documentOuterHeight - windowOuterHeight )
    {
        //bottom
    }
}

you don't need to use any element but the window to check if you've hit bottom

Related