React high order component that provides scrollreveal functionality
npm i --save react-scrollreveal
import React from 'react'
import withScrollReveal from 'react-scrollreveal'
class MyComponent extends React.Component {
render() {
const { animationContainerReference } = this.props;
return (
<div ref={animationContainerReference}>
...
</div>
)
}
}
export default withScrollReveal([
{
selector: '.sr-item',
options: {
reset: true,
},
},
{
selector: '.sr-item--sequence',
options: {
reset: true,
delay: 400,
},
interval: 100
}
])(MyComponent)
withScrollReveal HOC arguments. You have to provide object or array of objects with shape that described bellow:
{ selector {string} - css selector to get DOM nodes that init scrollreveal on options {object} - scrollreveal configuration interval {number} - interval in milliseconds to create animation sequence for selected elements }
Wrapped component props: