On-Scroll Letter Animations
source link: https://tympanus.net/codrops/2021/01/20/on-scroll-letter-animations/
Go to the source link to view the article. You can view the picture content, updated content and better typesetting reading experience. If the link is broken, please click the button below to view the snapshot at that time.
On-Scroll Letter Animations
By Mary Lou in Playground on
January 20, 2021
From our sponsor:
Today I’d like to share some on-scroll animations for typography with you. There’s a lot of artsy stuff that can be done when we scroll a page and moving letters is one of the things that can set an interesting “motion mood” to a design. Be it just a simple title or a menu or a card-like component, we can play with moving letters depending on the scroll (direction and speed).
This set is very experimental using Locomotive Scroll, and there are certainly better ways to calculate the translate value of each letter, depending on the length of the words, for example. I’ve made this quick and dirty but I hope it gives you some idea of what can be done.
In combination with images, we can add another layer of visual motion which makes possibilities really endless.
I hope you enjoy this little set and find it useful! Thank you for checking by and hit me up on Twitter @crnacura or @codrops, I’d love to hear your feedback!
Recommend
About Joyk
Aggregate valuable and interesting links.
Joyk means Joy of geeK