Stop page from scrolling past specified Div (or Footer element)

Question

Seemingly, this question has been asked several times, but not with my specific situation / needs.

I recently had a product filter developed for an eCommerce site. It's working fine, however, the setup involves the products that have been 'filtered out' being sent out of view at the bottom of the site. Whilst they are out of view to the customer, the browser still allocates space for them at the bottom, hence my site now scrolls well past the footer.

My Question is; Is it possible to lock off scrolling at a certain part of a page using jQuery or CSS?

eg; stop scrolling at base of footer. Or slot in an Div with an ID at the bottom of the page and spec no scrolling past that?

Many thanks in advance.

Damien

Answer 1

jsfiddle：http://jsfiddle.net/KwgMj/184/

您可以处理滚动事件，然后限制任何给定值的滚动。

$(window).scroll(function(e) {   
    if($(window).scrollTop() >=150) {
       $(window).scrollTop(150);
    }
});

只需将“150”替换为所需div的y位置。