ORStudios
ORStudios

Reputation: 3233

How to detect when you are at the bottom of scrollable div?

I am having trouble detect when I am at the bottom of a scrollable div. I have a div that is absolute positioned, the div is set to 100% height and is scrollable. The div contains numerous articles one below the other.

My aim is to detect when the div has been scrolled to the bottom. I am using the following code for testing but the value for the scroll.height does not add up because it is giving me the height of the browser window instead of the height of the scrollable content.

$('#scroll_length').text($('.scroll').scrollTop() + ' -- ' + $('.scroll').innerHeight());

Any ideas?

Upvotes: 0

Views: 213

Answers (2)

Silagy
Silagy

Reputation: 3083

In Addition to @Christian Varga Answer...

I know i am not answering with a code, but i think it will be nice addition to the question to present a plugin to help achieve your goal.

Some times question become a knowledge base....

You might find this plugin useful

jQuery Waypoints

Upvotes: 1

Christian
Christian

Reputation: 19750

I answered a similar question a while ago, and I believe it is still relevant: Using jQuery, how do I force a visitor to scroll to the bottom of a textarea to enable the submit button?

$('#terms').scroll(function () {
    if ($(this).scrollTop() == $(this)[0].scrollHeight - $(this).height()) {
        $('#register').removeAttr('disabled');
    }
});

Simply give terms an id, and set the register button to disabled in the html. I also made a little fiddle to show it working: http://jsfiddle.net/ETLZ8/

Upvotes: 1

Related Questions