How can I make a div disappear when scrolling down 100px from the top?

Question

I want to make a div disappear when I scroll down 100px and then reappear when within those 100px again from the top of the browser window. I don\'t want any animations just

Answer 1

You wont be able to do this in pure HTML or CSS, you'll need to resort to Javascript, your best bet is likely jQuery- as such it can be relatively easy to do this using:

$(window).bind('scroll', function() {
     if ($(window).scrollTop() > 100) {
         $('#myDivId').hide();
     }
     else {
         $('#myDivId').show();
     }
});