Solid Bits

Scroll Velocity

Solid Bits Solid Bits Solid Bits Solid Bits Solid Bits Solid Bits 
Scroll Down Scroll Down Scroll Down Scroll Down Scroll Down Scroll Down 

Customize

Velocity100

Props

PropertyTypeDefaultDescription
texts
string[]
[]
Array of strings to display as scrolling text.
velocity
number
100
Base velocity for scrolling; sign is flipped for odd indexed texts.
className
string
""
CSS class applied to each text copy (span).
damping
number
50
Damping value for the spring animation.
stiffness
number
400
Stiffness value for the spring animation.
numCopies
number
6
Number of copies of the text rendered for a continuous scrolling effect.
velocityMapping
{ input: number[]; output: number[] }
{ input: [0, 1000], output: [0, 5] }
Mapping from scroll velocity to a movement multiplier for dynamic scrolling.
parallaxClassName
string
"parallax"
CSS class for the parallax container.
scrollerClassName
string
"scroller"
CSS class for the scroller container.
parallaxStyle
any
undefined
Inline styles for the parallax container.
scrollerStyle
any
undefined
Inline styles for the scroller container.

Dependencies