2.2.6 • Published 2 years ago
react-animate-children v2.2.6
React Animate Children ·
React Animate Children allows to add microinteractions to the mounting phase of components.
This library features IntersectionObserver
so that the animation can start once the children are visible on the screen!
Features
- Compatible with
styled-components
- Use of
IntersectionObserver
api
Installation
npm i react-animate-children
Usage
import AnimateChildren from 'react-animate-children'
const Test = () => {
return (
<AnimateChildren>
<div>Hello World</div>
</AnimateChildren>
)
}
Props
Property | Type | Default | Required | Description |
---|---|---|---|---|
children | React Node(s) | null | Yes | Children components wrapped inside AnimateChildren |
direction | 'left', 'right', 'up', 'down' | down | No | Specifies the direction in which the component will get mounted |
behaviour | 'scroll', 'auto' | auto | No | Auto will mount the children components once the page loads, scroll will load them when the children is visible on the screen |
speed | number | 500 | No | Specifies the time it will take to start the animation |
offset | number | 50 | No | Specifies how many pixels it will have as offset when the animation start |
Credits
PRs are welcome!
2.2.6
2 years ago
2.2.5
2 years ago
2.2.3
2 years ago
2.2.2
2 years ago
2.2.1
2 years ago
2.1.14
2 years ago
2.1.12
2 years ago
2.1.11
2 years ago
2.1.8
2 years ago
2.1.7
2 years ago
2.1.6
2 years ago
2.1.5
2 years ago
2.1.4
2 years ago
2.1.3
2 years ago
2.1.2
2 years ago
2.1.1
2 years ago
2.1.0
2 years ago
2.0.9
2 years ago
2.0.8
2 years ago
2.0.7
2 years ago
2.0.6
2 years ago
2.0.5
2 years ago
2.0.4
2 years ago
2.0.3
2 years ago
2.0.2
2 years ago
2.0.1
2 years ago
2.0.0
2 years ago
1.0.8
2 years ago
1.0.7
2 years ago
1.0.6
2 years ago
1.0.5
2 years ago
1.0.4
2 years ago
1.0.2
2 years ago
1.0.1
2 years ago
1.0.0
2 years ago