How to Enable Scrolling on Website That Disabled Scrolling

Disable Scrolling on Body

Set height and overflow:

html, body {margin: 0; height: 100%; overflow: hidden}

http://jsfiddle.net/q99hvawt/

scrolling disabled in the webpage when full screen mode is triggered

Change el to document.documentElement and the scrolling will work in Firefox.

var el = document.documentElement;

It will break in JSFiddle while using Chrome(because of iframe policies I guess), but I don't think that's the main use.

Bootstrap: Prevent Scrolling in LG or larger, Enable Scrolling in MD or smaller

Instead of using h-100 I would use min-vh-100 on the "pages", and then you only need to have a @media query for the body overflow (no JS needed):

@media (min-width: 576px) { 
  body {
      overflow: hidden;
  }
}

https://codeply.com/p/dfIMHaQwV1

---

Related Topics