What You’ll Learn
By following this course, you will learn how to animate and control DOM elements using the very powerful GreenSock library. Envato Tuts+ instructor Craig Campbell will take you through a series of techniques, starting with basic animations and then moving on to more complex ones involving multiple objects. Finally, you'll create an animated menu.
Here are some free lessons from this course, as a preview of what you can expect:
Creating a “to” Animation
In “TweenLite”, a “to” animation uses the target element’s current properties as a starting point for the animation. In this lesson, you will learn the syntax for creating simple movement. The course uses CodePen to provide the code for each lesson, so you may want to refer to the Starter Pen for this lesson.
Easing allows you to customize the speed of an animation to make it look more realistic. In this lesson, you will learn how to apply basic easing to your tweens. Again, here's the Starter Pen.
Animating Multiple Objects
The first chapter of the course covers basic animations, and in this lesson you will start to tackle more complex animations involving multiple objects. Here's the Starter Pen for this one.
You can take our new course straight away with a subscription to Envato Elements. For a single low monthly fee, you get access not only to this course, but also to our growing library of over 1,000 video courses and industry-leading eBooks on Envato Tuts+.
Plus you now get unlimited downloads from the huge Envato Elements library of 200,000+ photos and 26,000+ design assets and templates. Create with unique fonts, photos, graphics and templates, and deliver better projects faster.
Or, if you're not ready to learn animation techniques right now, you may want to look for some pre-made CSS animations to include in your projects.
Subscribe below and we’ll send you a weekly email summary of all new Web Design tutorials. Never miss out on learning about the next big thing.Update me weekly
Envato Tuts+ tutorials are translated into other languages by our community members—you can be involved too!Translate this post