Customizable slide fade-in animation for react
npm install react-slide-fade-inA container component that will add a slide fade in animation to children elements.
yarn add react-slide-fade-in
or
npm install react-slide-fade-in
The container component receives the following props:
``typescript
{
// Position to slide in from
from: 'top' | 'bottom' | 'left' | 'right'
// Offset from final position in pixels
positionOffset: number
// Offset for the trigger in pixels
// (to trigger before or after the final position is visible)
triggerOffset: number
// [Optional] Fade animation start delay in milliseconds. Default: 0 ms
delayInMilliseconds?: number
// [Optional] Fade animation duration in milliseconds. Default: 1200 ms
durationInMilliseconds?: number
}
`
`typescript
import { FadeIn } from
export const Example: FC = () => (