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()
, thedocument.body
is styled withoverflow: hidden
and apadding-right
that mimics the width of the scrollbar. - When you turn it
off()
, everything goes back to the way it was before.
npm install no-scroll
Dependencies: none.
But your build process will need to handle CommonJS.
IE9+
Not touchscreens (see Caveats below)
This module exposes two simple functions: on()
and off()
.
var noScroll = require('no-scroll');
// To turn off the document's scrolling
noScroll.on();
// To restore scrolling
noScroll.off();
I have not yet figured out or found an ideal way of stopping scrolling on touch devices.
(The common practice of e.preventDefault()
on touchmove
events is too obstructive,
at least for a library;
for example, it disables scrolling of any element, not just the document.)
Any big ideas? Please PR?