Disable/enable scroll only on Modal

Question

I have a page with modal window, I want to in order to user could scroll divs in modal (when modal is open), but not all page, and if user close modal window he can scroll all page.

$(window).scroll(function (e) {
   if (!  modal ) {
       e.preventDefault();
   }
})

Is it possible ?

Answer 1

You can set body overflow property to hidden to prevent scroll. For example by adding some class to body element when popup is open:

.no-scroll {
    overflow: hidden;
}

Compare scroll behavior with overflow: hidden and auto in next demo.

Demo: http://jsfiddle.net/mrceaqxn/1/