GSAP Typing Animation | Tween & Timeline Basics (2020)

Описание: In this video, we're going to create a typewriter effect using GSAP. There are no CSS animations. You'll be surprised at how little code this takes. Only about 15 lines of JavaScript.

So, what is GSAP? It's the GreenSock Animation Platform. Their tag line is "Ultra high-performance, professional-grade animation for the modern web".

It's a set of small JavaScript files that help you create animations that look great in modern browsers. This library for animations is super easy to use. I'll show you some basics in this video.

We'll cover tween and timeline basics.

Code: https://github.com/codeSTACKr/gsap-ty...

Timeline:
00:00 Intro
00:19 Sponsor (Scrimba)
01:09 What is GSAP?
01:34 HTML
03:12 CSS
04:45 JavaScript - Cursor Animation
07:10 CSS - Box Styles
08:28 JavaScript - Box Animation
12:31 JavaScript - Text Animation
17:52 JavaScript - Flicker Animation
_____________________________________

📚 Learn to CODE in just a FEW months here:
Treehouse Discount Code: https://treehouse.7eer.net/codeSTACKr
_____________________________________

🛠️ Tools I use:
🟠 Theme: https://marketplace.visualstudio.com/...
🟠 Font: STACKr Code (Exclusive to my VS Code Course - https://vsCodeHero.com)
🟠 SuperHero Extension Pack: https://marketplace.visualstudio.com/...

🚢 Deploy for FREE on Vercel: https://vercel.com/ambassadors/codest...
_____________________________________

📢 Limited Time Offer from Scrimba!! https://scrimba.com/path/gfrontend?ut...
_____________________________________

💖 Show support!
PayPal: https://paypal.me/codeSTACKr
_____________________________________

Watch Next:
Web Development - Beginners Roadmap (2020) -    • Web Developer Roadmap 2020 | A Guide To St...  
Playlist: Web Development For Beginners -    • Web Development - Beginners Roadmap (2019)  
_____________________________________

Connect With Me:
Website: http://www.codestackr.com
Twitter:   / codestackr  
Instagram:   / codestackr  
Facebook:   / codestackr  
_____________________________________

** Affiliate Disclaimer: Some of the above links may be affiliate links, which may generate me a sales commission at no additional cost to you.

#codeSTACKr #GSAP #Animation