scroll-lock-body-2

About

Minimal code to enable scroll lock on the body element. This uses the approach from Bootstrap modal components where the body width is contained.

It has been tested on

• Phones (iOS, Android)
• Tablets (iPadOS, Android)
• Laptops (Mac, Windows)
• Modern browsers

It updates when the devices rotates and if the height changes on interaction.

Browser Support

| | | | | ---------------------------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------------------ | ------------------------------------------------------------------------------------------------- | | 60+ | 12+ | 60+ |

Alternate version with margin-top implementation

An alternate version with same API exists with some required CSS setup https://github.com/kunukn/scroll-lock-body

Demo

Installation

This library is published in the NPM registry and can be installed using any compatible package manager.

yarn add scroll-lock-body-2

# For npm, use the command below.
npm install scroll-lock-body-2 --save

Usage

import {
  enableScrollLock,
  disableScrollLock,
  isScrollLockEnabled,
  getScrollbarWidth,
} from 'scroll-lock-body-2'

// Run this to lock the body scroll
enableScrollLock()

// Run this to unlock the body scroll
disableScrollLock()

// Run this to get the lock state
isScrollLockEnabled() // returns true or false

// Run this to get the width of the body scrollbar
getScrollbarWidth() // returns a number

Installation from CDN

This module has an UMD bundle available through JSDelivr and Unpkg CDNs.

<!-- For UNPKG use the code below. -->
<script src="https://unpkg.com/scroll-lock-body-2"></script>

<!-- For JSDelivr use the code below. -->
<script src="https://cdn.jsdelivr.net/npm/scroll-lock-body-2"></script>

<script>
  // UMD module is exposed through the "scrollLockBody" global variable.
  console.log(scrollLockBody)
</script>

Explore the dist files

https://unpkg.com/scroll-lock-body-2/

Documentation

Documentation generated from source files by Typedoc.

License

Released under MIT License.