COAP:COAP-3000/week5: Difference between revisions
Jump to navigation
Jump to search
m (→Wednesday) |
mNo edit summary |
||
| Line 2: | Line 2: | ||
|is_part_of_syllabus=COAP:COAP-3000 | |is_part_of_syllabus=COAP:COAP-3000 | ||
|do_not_show_sub_page=No | |do_not_show_sub_page=No | ||
|page_previous=COAP:COAP-3000/ | |page_previous=COAP:COAP-3000/week4 | ||
|page_next=COAP:COAP-3000/week5 | |page_next=COAP:COAP-3000/week5 | ||
| | |objective=create animations with GSAP | ||
use jQuery to get a handle on elements | |||
|cat_syllabus=COAP-3000 | |cat_syllabus=COAP-3000 | ||
}} | }} | ||
== Monday == | == Monday == | ||
Revision as of 21:13, 15 April 2018
Monday
Creating animations with the GSAP library
The GreenSock Animation Platform (GSAP) is a powerful and relatively easy to use suite of animation libraries for HTML5. As of April 2018, it includes:
- TweenLite -handles animating just about any property of any object.
- TweenMax - adds some extras.
- TimelineLite a container for tweens to control them as a whole and precisely manage their timing in relation to each other
- TimelineMax - adds some extras.
In this class, we will work with TweenMax.
- Either download it from here or
- include the library as CDN, like this:
<script src="https://cdnjs.cloudflare.com/ajax/libs/gsap/1.20.3/TweenMax.min.js"></script>
Hands on
Also on codepen
Wednesday
- GSAP continued
- Midterm (1hour)
Project 5
Create an animation with the GSAP library.
Requirements:
- At least three animations
- A start and a stop button for at least one animation.
Due:
- Wednesday, week 6 before class
- Upload to the worldclassroom