Skip to content

Disable scrolling on an element that would otherwise scroll

License

Notifications You must be signed in to change notification settings

damfinkel/no-scroll

 
 

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

24 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

no-scroll

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(), the documentElement is styled with width: calc(100% - scrollbarSize), position: fixed, top: currentScrollTop, and overflow: hidden.
  • When you turn it off(), everything goes back to the way it was before.

Installation

npm install no-scroll

Dependencies: none.

Browser Support

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.

Usage

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.

About

Disable scrolling on an element that would otherwise scroll

Resources

License

Stars

Watchers

Forks

Packages

No packages published

Languages

  • HTML 65.2%
  • JavaScript 34.8%