@grawl-ru/tua-body-scroll-lock

🔐Body scroll locking that just works with everything

Usage no npm install needed!

<script type="module">
  import grawlRuTuaBodyScrollLock from 'https://cdn.skypack.dev/@grawl-ru/tua-body-scroll-lock';
</script>

README

tua-body-scroll-lock

inspired by body-scroll-lock

dependencies Downloads per month Version Next Version License

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)

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

CDN

<!-- unpkg -->
<script src="https://unpkg.com/tua-body-scroll-lock"></script>

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

<!-- jsdelivr -->
<script src="https://cdn.jsdelivr.net/npm/tua-body-scroll-lock/dist/tua-bsl.umd.min.js"></script>

Usage

Normal

import { lock, unlock } from 'tua-body-scroll-lock'

lock()
unlock()

TargetElement needs scrolling(iOS only)

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

import { lock, unlock } from 'tua-body-scroll-lock'

const targetElement = document.querySelector('#someElementId')

lock(targetElement)
unlock(targetElement)

The targetElement is not required on the PC and Android.

Test

testLink

bodyScrollLock

Contributors

Thanks goes to these wonderful people (emoji key):

evinma
evinma

💻 📖 🚇 🌍
StEve Young
StEve Young

💻 📖 🚇 🌍
li2go
li2go

💻 🐛
songyan,Wang
songyan,Wang

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

🐛

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