React Focus on Scroll

A react component which focuses sections while scrolling

See Demo and Documentation.

Props

The component takes the followin props.

| Prop | Type | Description | |-------------------|------------|-------------| | className | string | Additional classnames for the component | | focusOn | string | Initial focused section| | onFocus | function | Callback function to invoke when a section is focues The function should contain one parameter(focusIndex). |

Installation

npm install react-focus-scroll --save

Usage

import FocusOnScroll from "react-focus-scroll";

<FocusOnScroll
  focusOn="1"
  onFocus={onFocus}
  classNames="custom-class"
>
  <div>This is first section</div>
  <div>This is second section</div>
</FocusOnScroll>

License

MIT Licensed. Copyright (c) Farhad Yasir 2019.