[jQuery] Infinite Scroll within a div element - How detect relative scroll position?

Sun, 28 Sep 2008 20:07:10 -0700 

How can I detect when the user has scrolled near the end of a div with
a scroll bar so that I can add more content?

I tried something like this:

 $('div#content').scroll(function(){
            if  ($('div#content').scrollTop() == 9083){
               get_more_content();
            }
    });

But I don't really understand what scrollTop() is returning.  When I
first load the page scrolling to the bottom of that div has scrollTop
returning 9083, but after I add more content and scroll to the end, it
gives 13,000 something.

What's the formula for taking what scrollTop() is giving me and
figuring out if I am near the end?

If it helps, here's my basic HTML and CSS:

<body>
<div id="content">
    ...lots of content
</div>
</body>

I have CSS so that div#content gets a scroll bar:
div#content {
    margin-left:auto;
    margin-right:auto;
    width:850px;
    height:600px;
    overflow:auto;
    border-style:solid;
    border-width:1px;
    margin-bottom:30px;
}

Thanks in advance,

Greg

Reply via email to