Use jquery to make div appear after a user scrolls

Andelas picture Andelas · Jan 1, 2011 · Viewed 8.4k times · Source

I'd like to have a div appear after a user scrolls down on a page, and disappears if they scroll back to the top.

I thought using the .scroll() function in jquery would be useful, but couldn't quite figure out how to make this happen.

Any help would be appreciated. Thanks!

Answer

chprpipr picture chprpipr · Jan 1, 2011

Something like this should do the trick:

$(window).scroll(function() {
    if ($(this).scrollTop() == 0) {
        $("#mydiv:visible").hide();
    }
    else {
        $("#mydiv:hidden").show();
    }
});