tua-body-scroll-lock

inspired by body-scroll-lock

English | 简体中文

Introduction

tua-body-scroll-lock enables body scroll locking for everything.

Why not body-scroll-lock?

• Doesn't work on Android webview
• Doesn't work on PC with mouse wheel
• Doesn't work on iOS, if you touch somewhere instead of targetElement
• Must pass targetElement, even if it's not necessary

Try This

Install

Node Package Manager(recommended)

1$ npm i -S tua-body-scroll-lock
2# OR
3$ yarn add tua-body-scroll-lock

CDN

• UMD(tua-bsl.umd.js)
  • unpkg
  • jsdelivr

1<!-- unpkg -->
2<script src="https://unpkg.com/tua-body-scroll-lock"></script>
3
4<!-- jsdelivr -->
5<script src="https://cdn.jsdelivr.net/npm/tua-body-scroll-lock"></script>

• Minified UMD(tua-bsl.umd.min.js)
  • unpkg
  • jsdelivr

1<!-- unpkg -->
2<script src="https://unpkg.com/tua-body-scroll-lock/dist/tua-bsl.umd.min.js"></script>
3
4<!-- jsdelivr -->
5<script src="https://cdn.jsdelivr.net/npm/tua-body-scroll-lock/dist/tua-bsl.umd.min.js"></script>

Usage

Normal

1import { lock, unlock } from 'tua-body-scroll-lock'
2
3lock()
4unlock()

TargetElement needs scrolling（iOS only）

In some scenarios, when scrolling is prohibited, some elements still need to scroll, at this point, pass the targetElement.

1import { lock, unlock } from 'tua-body-scroll-lock'
2
3const targetElement = document.querySelector('#someElementId')
4
5lock(targetElement)
6unlock(targetElement)

The targetElement is not required on the PC and Android.

Test

testLink

Contributors

Thanks goes to these wonderful people (emoji key):

evinma 💻 📖 🚇 🌍

StEve Young 💻 📖 🚇 🌍

li2go 💻 🐛

songyan,Wang 💻 🐛

Даниил Пронин 🐛

This project follows the all-contributors specification. Contributions of any kind welcome!