catandmouse
catandmouse

Reputation: 11829

How to determine if you have scrolled to the bottom of an element?

How will you determine if you have reached the bottom of an element? For instance you have a div with a height of 2000px, then the viewport is only 600px tall. With these in place, how will you know how much scroll value you need to know if it's already the bottom of the 2000px div?

Upvotes: 0

Views: 1559

Answers (1)

Blender
Blender

Reputation: 298532

You can use something like this:

var $element = $('div');

$(window).scroll(function() {
    var scroll = $(window).scrollTop() + $(window).height();
    var offset = $element.offset().top + $element.height();

    if (scroll > offset) {
        $element.css('background', 'blue');
    } else {
        $element.css('background', 'red');
    }
});

Demo: http://jsfiddle.net/eNjEs/5/

Upvotes: 2

Related Questions