The Greensock syntax is similar to other libraries like jQuery. Animation properties are passed using an object literal. Sarah walks through the syntax and also demonstrates the different built-in easing functions.
- [Sarah] So we're gonna continue with some GSAP goodies.…But before I get into, like, some…of the really really fun stuff, I'm just gonna give you…the tools so that you can even get there,…and show you what some of the GSAP syntax,…the GreenSock syntax is.…So if we do a GreenSock overview.…As you can see, the syntax is really, really simple.…I could write this on one line of code,…but then you probably couldn't see it so well.…And I'll even scroll in here.…So what we've got is TweenLite or TweenMax, depending…on which version you're using, which you're loading,…or, you know, if you're using TweenMax you can still…use TweenLite, but not the other way around.…
Then we've got .to/.from or /.fromTo.…I'll go into why you'd use a from to in a minute,…but obviously, to is going to the thing.…From is coming from the thing.…Froms are really nice for, like,…entrances and things like that.…- [Audience Member] Just one quick question from before.…You were showing some, an example.…And the question was, "how do you keep track…
Note: This course was created by Frontend Masters. It was originally released on 2/19/2016. We're pleased to host this training in our library.
- Paths and groups
- Platonic shapes
- Optimization and CSS animations
- SVG sprites
- Atmospheric and elemental motion
- GreenSock workflow
- Staggering animations
- UI/UX animation vs. standalone
- DrawSVG and motion along a path
- Animating text and relative color values