ElyriScrollMarquee
Slides text horizontally as the page scrolls vertically, with opposite directions on alternating rows, respecting reduced-motion preferences.
Elyri · React motion componentsElyri · React motion componentsElyri · React motion componentsElyri · React motion componentsElyri · React motion componentsElyri · React motion components
Customize
Props
| Prop | Type | Default | Description |
|---|---|---|---|
children | string | — | Text to scroll |
direction | 'left' | 'right' | 'left' | Horizontal direction the text travels in |
speed | number | 0.5 | Pixels the text moves horizontally per pixel of page scroll |
rows | number | 1 | Number of rows; adjacent rows travel in opposite directions |
repeat | number | 6 | How many times the content repeats, to fill the width and loop seamlessly |
className | string | — | Extra class name |