ScrollTrigger Express

10h 31m 38s
English
Paid

Course description

ScrollTrigger is the most revolutionary GreenSock plugin to date. With it, you can control all your animations with the precision and performance characteristic of GreenSock tools. There's no longer a need to use third-party tools with limited functionality. In this course, I will explain the main features of ScrollTrigger step-by-step and show you how to elevate your animations to a new level. I have spent over 100 hours studying this plugin and preparing lessons so that you can get started quickly and avoid common mistakes.

Watch Online

Join premium to watch
Go to premium
# Title Duration
1 Get Started in 3 Easy Steps 10:15
2 Scrub and Pin 07:31
3 Pinning and pinSpacing Overview 06:30
4 Pinning Deep Dive 08:32
5 Pin Spacing 05:15
6 Pinning Car Project 05:02
7 Intro to Parallax Scrolling 09:31
8 Aerial SVG Car Parallax 09:42
9 ScrollTriggers for Multiple Sections 13:44
10 Smooth Scrolling with Locomotive Scroll 20:45
11 Prevent Scroll on Fullscreen Intro 18:43
12 Back to Top Link: fastScrollEnd and toggleClass 07:23
13 Change Nav Color on Scroll 15:50
14 Change Nav Color on Scroll: Part 2 Responsive 10:42
15 Scroll-Based Reading Progress Bar 18:05
16 ScrollTo Plugin and ScrollTrigger (Animated Jump Links) 10:28
17 ScrollTrigger Toggle Animations 4 Ways 13:56
18 Responsive Scroll-Driven Line-by-Line Text Effect Part 1 14:41
19 Responsive Scroll-Driven Line-by-Line Text Part 2 11:38
20 Off-Screen Reset 09:42
21 3D Rolling Headers 19:34
22 3D Rolling Headers: Multiple Headers and Variations 12:54
23 Scroll-Driven Multi-Colored Line Section Indicators 15:04
24 Slide-in Panels 11:04
25 Layered Pinning 06:01
26 Layered Pinning from Bottom 06:59
27 SVG Mega Scroll and Follow 26:26
28 Use ScrollTrigger Callbacks to Control HTML5 Video 10:05
29 Scoll-Driven SVG Path Follower 19:38
30 Part 1: File setup, Alternating Rows and ScrollTrigger Basics 17:23
31 Part 2: Offscreen Reset 07:50
32 Part 3: Mobile Layout 18:41
33 Introduction: File Setup and Pinning 14:08
34 Basic Staggered Animation 07:46
35 Content Sections with Varying Heights 19:47
36 Responsive Layout 13:18
37 Using gsap.matchMedia() 07:03
38 Horizontal Scroll and Pin Part 1 08:11
39 Horizontal Scroll: Container Animations 16:04
40 Horizontal Scroll Triggering Secondary Animations 19:24
41 Horizontal Scroll: Import SVG Maps and Responsive Issues 13:03
42 Horizontal Scrolling: Fixing Responsive Issues 09:31
43 Horizontal Scrolling: SVG Animation 11:27
44 Part 1: File Setup and Staggered Animation 10:35
45 Adding 3D Layout and Animation 16:27
46 Multiple Headers 08:16
47 Exploring Responsive Issues and Adding ScrollTrigger 07:57
48 Fixing Responsive Issues 11:02
49 Basic Mode 10:01
50 Building a Timeline of Function Calls 10:46
51 Pro Mode 10:46
52 Pro Highlight Mode 06:32

Comments

0 comments

Want to join the conversation?

Sign in to comment

Similar courses

Normal UI

Normal UI

Sources: Anthony Alicea
You don't need to be a designer to make a web application more user-friendly. Successful web applications are user-friendly web applications. The better...
39 minutes 16 seconds
Framer Motion Recipes

Framer Motion Recipes

Sources: Build UI
Framer Motion is a popular React animation library. It features both declarative and imperative APIs, so you can add common animations in just a few lines of code, or drop down ...
3 hours 8 minutes 18 seconds
Full-Stack Tao

Full-Stack Tao

Sources: Alex Kondov
Software development is not only about creating new features, but also about writing code that retains its value over time and remains flexible to changes.
Developing LLM App Frontends with Streamlit

Developing LLM App Frontends with Streamlit

Sources: zerotomastery.io
This byte-sized course will teach Streamlit fundamentals and how to use Streamlit to create a frontend for your LLM-powered applications.
1 hour 43 minutes 52 seconds