I'm using Google Chrome 10 and writing JavaScript to detect scroll end.

To detect scroll end of window, the code below worked fine:

window.addEventListener(

    'scroll',

    function()

    {

        var scrollTop = document.documentElement.scrollTop ||

            document.body.scrollTop;

        var offerHeight = document.body.offsetHeight;

        var clientHeight = document.documentElement.clientHeight;

        if (offsetHeight <= scrollTop + clientHeight)

        {

            // Scroll end detected

        }

    },

    false

);

Now I want to detect scroll end of the specified element, like <section id=box style=height: 500px; overflow: auto;>

This is the code that doesn't detect correctly:

document.getElementById('box').addEventListener(

    'scroll',

    function()

    {

        var scrollTop = document.getElementById('box').scrollTop;

        var offerHeight = document.getElementById('box').offsetHeight;

        var clientHeight = document.getElementById('box').clientHeight;

        if (offsetHeight <= scrollTop + clientHeight)

        {

            // This is called before scroll end!

        }

    },

    false

);

Could someone please fix my code? Thanks.