Hello guys! 👋🏼
In this video, we will show you another simple tutorial where we create a cool-looking text animation using the ScrollTrigger built into Motion.page!
In this specific example, we will be manipulating the letter-spacing property, as well as the color, and also the text-shadow to apply a stroke to the text as we scroll down the page.
Here is the CSS for the text-shadow effect that was used in the video:
text-shadow: -2px -2px black, 2px -2px 0 black, -2px 2px 0 black, 2px 2px 0 black
We hope you like the simple effect and please don't hesitate to get in touch with us if you have any questions!
Many thanks, and see you in the next one!
----------------------------------------------------
00:06 - Intro
00:26 - Quick Demo
01:04 - Open Builder of Choice
01:35 - Add Text Elements
04:11 - Open Motion.page
04:26 - Set up the Trigger Settings
05:13 - Add First Animation Node
06:30 - Add Second Animation Node
07:06 - View on Frontend
07:20 - Minor Adjustments
07:30 - Final Result
08:10 - Outro
----------------------------------------------------
Purchase Motion.page today - https://motion.page
CoreFramework - https://coreframework.com
Смотрите видео Create Simple but Effective Text Animations - GSAP/Motion.page - ScrollTrigger онлайн без регистрации, длительностью часов минут секунд в хорошем качестве. Это видео добавил пользователь MotionPage 06 Декабрь 2023, не забудьте поделиться им ссылкой с друзьями и знакомыми, на нашем сайте его посмотрели 3,095 раз и оно понравилось 63 людям.