Jose Tamu
July 13, 2024 / Beginner
Swap Hover
Line Swap
Word Swap
Letter Swap
Animation controls
Type: determines the splitting. Lines, words or chars. Just like the demo
From: determines where the swap title will come from. Top or bottom. All Swap Titles from the demo come from bottom.
Skew: determines the amount of skew to apply to the title. Learn more about skew here.
Stagger: the delay to apply between lines, words or chars. This means, when the first line, word or char starts animating, the second will fire after “x” seconds determined by the stagger and so on.
Duration
CSS easing: you can set any custom CSS easing of your own. Learn more about CSS easings here.
-Tamu
On this page