A React component wrapper that restricts scrolling capabilities of everything except for its children.
npm install react-scroll-lock-componentA React component wrapper that restricts scrolling capabilities of everything except for its children.
Wheel events, touchmove events, and key press events that affect page location (e.g. directional arrows, pageup/pagedown/spacebar) are all locked.
npm install react-scroll-lock-component
or
yarn add react-scroll-lock-component
Usage
js
import React from 'react';
import ScrollLock from 'react-scroll-lock-component';export default () => (
{/*
unlike normal scroll functionality, when the user scrolls this
div and reaches the beginning or end nothing else on the page will scroll
*/}
{/ scrolling outside of the scroll lock will remain normal /}
);
`$3
|Prop|description|default value|
|:-:|:-:|:-:|
| enabled|programatically enable or disable the scroll lock|
|
|className|apply custom styles to the scroll lock component|''`|