react-scroll-context

A component to disable scroll on document body when its children are scrolled.

Install

yarn add react-scroll-context

or

npm install react-scroll-context --save

Props

1. enable: boolean set this to true if you want to manually disable scroll. Eg:
   • enable: true Enables scroll context and prevents scroll on document body.
   • enable: false Disables scrolls context and allows scroll on document body.
2. styles: string String of classNames to be added to the parent container.

WARNING The mouse events will not work if the enable prop is set to either(true / false).

Help

1. Uses mouse listeners for desktop / laptop browsers.
2. For mobile devices set enabled prop for enabling / disabling scroll context.
3. Takes care of jumps due to scrollbars on windows, linux etc.

Example

import ScrollContext from 'react-scroll-context';
 
function Component(props) {
  return (
    <ScollContext>
        {// your awesome jsx}
    </ScrollContext>
  );
}

License

MIT