react-focus-scroll

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.