gem-hunter

🚨 Not Maintained

React Scroll Lock

Install

yarn add react-scrolllock

Usage

import ScrollLock, { TouchScrollable } from 'react-scrolllock';

class Modal extends Component {
  state = { lockScroll: false }
  render() {
    return (
      <div>
        ...
        // the lock accepts a single child element, which supports touch-scrolling.
        <ScrollLock>
          <ElementWithScrollableContent>...</ElementWithScrollableContent>
        </ScrollLock>

        // if your app structure doesn't allow wrapping like above, the `TouchScrollable`
        // component is exposed as a named export.
        <ScrollLock />
        <TouchScrollable>
          <ElementWithScrollableContent>...</ElementWithScrollableContent>
        </TouchScrollable>

        // you can also toggle the lock based on some state.
        <ScrollLock isActive={this.state.lockScroll} />
      </div>
    );
  }
}

Props

ScrollLock

TouchScrollable