Disable the document's scrolling.
It's silly how many libraries have their own implementation of this. So I thought I'd make a module that other libraries could use.
Here's how this works:
- When you turn it
on()
, thedocumentElement
is styled withwidth: calc(100% - scrollbarSize)
,position: fixed
,top: currentScrollTop
, andoverflow: hidden
. - When you turn it
off()
, everything goes back to the way it was before.
npm install no-scroll
Dependencies: none.
Desktop: IE9+
Mobile: Has no effect in iOS, where this simple approach does not work. For a more complex approach that aims to block scrolling on iOS, try body-scroll-lock.
This module exposes three simple functions: on()
, off()
and toggle()
.
var noScroll = require('no-scroll');
// To turn off the document's scrolling
noScroll.on();
// To restore scrolling
noScroll.off();
// To toggle scrolling
noScroll.toggle();
If you do not have a CommonJS environment (no module.exports
), the module
exposes the global object noScroll
.