react-scroll-bound

Prevent scrolling on parent element if list reached end or start.

Brings a better control for user and increase use experience.

supports react 15.x and 16.x

Install

npm install react-scroll-bound --save

import ScrollBound from 'react-scroll-bound'

<ScrollBound>
    {this.getListPoints()}
</ScrollBound>

Set css for element overflow scroll

.my-class-name {
    max-height: 250px;
    overflow-y: auto;
}

default tagName is <ul>

<ScrollBound tagName="div">
    {this.getListPoints()}
</ScrollBound>

all attributes and properties will transmitted with {...this.props}

<ScrollBound 
    id="name" 
    onWheel={onWheel} 
    onClick={onClick} 
    className="my-list"
>
    {this.getListPoints()}
</ScrollBound>

if you want to add or optimize this component, feel free <3

npm start

npm run compile