Meet npm Pro: unlimited public & private packages + package-based permissions.Learn more »

body-scroll-toggle

0.2.0 • Public • Published

Body scroll toggle

Disables scroll-ability of the body, like you'd want when a fixed position modal is open, by logging the current scroll position and then making the body position fixed using that scroll offset of the body top. Thus, the user shouldn't see the body shift position. Many approaches just overflow:hidden on the body, but this does not disable scrolling in iOS.

const bodyScroll = require('body-scroll-toggle')
bodyScroll.disable()
bodyScroll.enable()

A disadvantage of this approach is that the iOS bottom nav bar will get re-displayed when the scroll is disabled.

Alternatives

There are JS event.preventDefault() based approaches like:

These work but will prevent scrolling of internal elements that have an overflow:scroll, which is often the case in mobile navs.

Contributing

Run npm version <newversino> && npm publish to push new builds up.

Keywords

none

Install

npm i body-scroll-toggle

DownloadsWeekly Downloads

163

Version

0.2.0

License

MIT

Last publish

Collaborators

  • avatar