DEV Community

Cover image for React Sticky Children
Kevin Farrugia
Kevin Farrugia

Posted on

React Sticky Children

I created a simple ReactJS plugin react-sticky-children to abstract away the complexities of the IntersectionObserver API and allow you to apply styles to a component as it approaches the top of the viewport. Useful for "Scroll to Top", complex "sticky" elements or animating components into view.

Demo

Demo

Usage

import { ReactStickyChildren } from 'react-sticky-children';

<ReactStickyChildren initialStyle={initialStyle} intersectingStyle={intersectingStyle}>
  <MyComponent />
</ReactStickyChildren>
Enter fullscreen mode Exit fullscreen mode

Looking for feedback. 🙏

NPM: https://www.npmjs.com/package/react-sticky-children
GitHub: https://github.com/kevinfarrugia/react-sticky-children

Top comments (1)

Collapse
 
lana_lanskaya_371608835b9 profile image
Liza

Educational information, and I know a cool app where you can find various educational activities for school and preschool age children. There is a large selection and everyone will definitely find something they like.
wunderkiddy.com/template/hands-tem...
hand outline