https://github.com/mauroreisvieira/scroll-lock
Lock body scroll without breaking scrolling of a target element.
https://github.com/mauroreisvieira/scroll-lock
css eslint javascript prettier rollup scroll-lock
Last synced: 3 months ago
JSON representation
Lock body scroll without breaking scrolling of a target element.
- Host: GitHub
- URL: https://github.com/mauroreisvieira/scroll-lock
- Owner: mauroreisvieira
- License: mit
- Created: 2019-09-25T10:28:11.000Z (almost 7 years ago)
- Default Branch: master
- Last Pushed: 2019-10-01T14:21:43.000Z (almost 7 years ago)
- Last Synced: 2025-04-09T15:16:01.727Z (over 1 year ago)
- Topics: css, eslint, javascript, prettier, rollup, scroll-lock
- Language: HTML
- Homepage: https://mauroreisvieira.github.io/scroll-lock/
- Size: 28.3 KB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# Scroll Lock
Lock body scroll without breaking scrolling of a target element (only for touch devices).
## Project Setup
``` bash
# Using npm
npm install
# Using Yarn
yarn add
```
### Compiles and hot-reloads for development
``` bash
yarn run dev
```
### Compiles and minifies for production
``` bash
yarn run build
```
### Lints and fixes files
``` bash
yarn run lint
```
## Usage examples
```js
import { Scrollock } from "./scrollock.js";
const targetElement = document.querySelector('#someElement');
const lock = new Scrollock({
element: targetElement
});
let isOpen = false;
document.querySelector('.btn').addEventListener('click', function() {
if (!isOpen) {
lock.disableBodyScroll();
} else {
lock.enableBodyScroll();
}
isOpen = !isOpen;
});
```
## Support Tested
- iOS (Safari 13 & Chrome 76)
- Android (Brave 1.3.2 & Chrome 77)