Тёмный
No video :(

velvety variable font weight hover with gsap 

Web Bae
Подписаться 8 тыс.
Просмотров 3,8 тыс.
50% 1

Let's recreate this velvety variable font weight hover animation with GSAP! I stumbled on this animation when Julian posted it on LinkedIn and had to poke around the code! I changed a few things: removed jQuery, trimmed down the code, refactor to module syntax, add match media query to only run the code on desktop, and reduce the burden of mathematics with GSAP mapRange utility. Big ups to Julian for sharing this one!
🤝 Julian's:
webflow.grsm.io/cloneable-is-...
👯‍♀️ Clone it:
try.webflow.com/cloneable-is-...
// FREE resources
✂️ Code Snippet Library: code-snippets-sign-up.webflow...
🤝 CSS Nobody Told You About: www.webbae.net/css-nobody-tol...
🚗 Roadmap to learn Webflow: www.webbae.net/roadmap-to-lea...
// Premium content
🤝 Patreon: / webbae
🕸️ Advanced Webflow Course (201): www.webbae.net/product/webflo...
// Discounts
🎢 Get 10% GSAP: WEBBAE10
♣️ Creative Coding Club (My favorite GSAP lessons): www.creativecodingclub.com/bu...
// Connect
🙋‍♀️ Join the Discord: / discord
🐥 Follow Me! / webisbae

Опубликовано:

 

27 мар 2024

Поделиться:

Ссылка:

Скачать:

Готовим ссылку...

Добавить в:

Мой плейлист
Посмотреть позже
Комментарии : 12   
@SinaNouri21
@SinaNouri21 2 месяца назад
Thanks for the tutorial. Can we do this on scroll ? Ill be really happy if you teach this
@heatherliu6856
@heatherliu6856 4 месяца назад
What if you run the code on one of those huge touch screens that are wider than 992 px? 🧐 Will the universe blow up?
@webbae
@webbae 4 месяца назад
prolly. yes.
@libra.
@libra. 4 месяца назад
0:22 bro has his own producer tag 😂
@webbae
@webbae 4 месяца назад
Yes! The people are beginning to understand! 🤣
@alexandrb1543
@alexandrb1543 4 месяца назад
This is awesome! I’ll definitely recreate that! Here is a video idea for you: create a tutorial for a parallax-like scroll for multiple images on mobile devices, especially for safari. I found an example of the idea, but can’t share the link here.
@webbae
@webbae 4 месяца назад
Sounds fun! Feel free to hop in discord and share with me there if you’d like.
@alexandrb1543
@alexandrb1543 4 месяца назад
@@webbae joining!
@twlysh
@twlysh 4 месяца назад
Nice shirt webbae
@libra.
@libra. 4 месяца назад
what code editor is that?
@webbae
@webbae 4 месяца назад
VS Code. I’ve got it in Zen mode 🧘‍♂️
@webbae
@webbae 4 месяца назад
Command + K then press Z
Далее
Why I won't switch to Framer (vs. Webflow)
18:25
Просмотров 4,7 тыс.
Getting started with Variable fonts on the web
21:44
Просмотров 42 тыс.
Штаны легионера
00:44
Просмотров 151 тыс.
▼КОРОЛЬ СОЖРАЛ ВСЕХ 👑🍗
29:48
Просмотров 393 тыс.
FLIP animations | HTTP 203
18:28
Просмотров 21 тыс.
This UI component library is mind-blowing
8:23
Просмотров 634 тыс.
We dive into xAtom with founder Virat Patel.
1:16:57
Просмотров 1,5 тыс.
Simple SVG logo preloader animation with CSS!
8:19
Просмотров 1,1 тыс.
Designers Are Leaving Webflow... Here's Why
4:46
Просмотров 198 тыс.
How to Build Magnetic Tooltips with GSAP Flip
9:49
Просмотров 1,8 тыс.
Dependency Injection | Prime Reacts
28:34
Просмотров 310 тыс.
Jonathan Blow Choosing a Font
9:43
Просмотров 33 тыс.
Штаны легионера
00:44
Просмотров 151 тыс.