Disable Scrolling on Body

Question

I would like to disable scrolling on the HTML body completely  I have tried the following options    overflow  hidden   not working  did not disable scrolling  it just hid the scrollbar  position  fixed   this worked  but it scrolled completely to the top  which is unacceptable for this specific application    I was unable to find any alternatives to these two options  are there any more

User · Answer

HTML css works fine if body tag does nothing you can write as well

<body scroll="no" style="overflow: hidden">

In this case overriding should be on the body tag, it is easier to control but sometimes gives headaches.

User · Answer

This post was helpful  but just wanted to share a slight alternative that may help others   Setting max-height instead of height also does the trick  In my case  I m disabling scrolling based on a class toggle  Setting  someContainer  height  100   overflow  hidden   when the container s height is smaller than that of the viewport would stretch the container  which wouldn t be what you d want  Setting max-height accounts for this  but if the container s height is greater than the viewport s when the content changes  still disables scrolling

User · Answer

To accomplish this  add 2 CSS properties on the  lt body gt  element   body      height  100      overflow-y  hidden      These days there are many news websites which require users to create an account  Typically they will give full access to the page for about a second  and then they show a pop-up  and stop users from scrolling down

User · Answer

Set height and overflow   html  body  margin  0  height  100   overflow  hidden    http   jsfiddle net q99hvawt

[html] Disable Scrolling on Body

Examples related to html

Examples related to css

Examples related to scroll