disable main window scrolling - Jquery

Question

I have a webpage with a lightbox in it, inside the lightbox there is a scrollbar. I want to disable the main window scrollbar and keep the lightbox scrollbar enabled.

Not just to hide the scrollbar but to disable scrolling of the window at all (beside scrolling the lightbox).

How can I do it?

score 4 · Answer 1 · answered Mar 09 '14 at 19:04

4

You dont need jQuery. Use Stylesheet:

 html, body {
      overflow: hidden;
 }

answered Mar 09 '14 at 19:04

Adrian Preuss

3,228
1
23
43

this just hides the scrollbars, but i can still scroll with the mouse – Kadosh Mar 09 '14 at 20:01
You also need to add `overflow:hidden;` to any child elements you may have. – musicnothing Mar 09 '14 at 20:07

score 2 · Accepted Answer · edited May 23 '17 at 11:54

2

You probably need to call

$("body").scroll(function(e){ e.preventDefault()});

when lightbox is opened.

You also may be interested with this question.

edited May 23 '17 at 11:54

Community

1
1

answered Mar 09 '14 at 19:05

Michał

2,456
4
26
33

this just hides the scrollbars, but i can still scroll with the mouse – Kadosh Mar 09 '14 at 20:03
using this code the page still can be scrolled... any other suggestions? – Kadosh Mar 09 '14 at 20:13
Take a look at the link in the answer, you can find few suggestions there. – Michał Mar 09 '14 at 20:15
Thanks found the answer in the link – Kadosh Mar 09 '14 at 21:21
For me it doesn't work but I use this code and it works: $(window).bind('mousewheel', function(event) { event.preventDefault(); }); – Mateusz H. Apr 30 '18 at 14:36

disable main window scrolling - Jquery

2 Answers2