Scroll Element
A Framer Motion animation component that allows for directional animations, including movement from left, right, or bottom.
Installation
npx uilayouts@latest add scroll-element
Props
| Prop | Type | Default | Description |
|---|---|---|---|
| children | React.ReactNode | The content to be rendered within the scroll element. | |
| className | string | Optional CSS class for styling the scroll element. | |
| variants | object | Animation variants for different scroll states (hidden/visible). | |
| viewport | object | { amount: 0.5, margin: '0px', once: true } | Settings for when the element is considered in view. |
| delay | number | 0 | Delay before the animation starts, in milliseconds. |
| direction | Direction | 'down' | The scroll direction for the animation (e.g., 'down', 'up'). |