COAP:COAP-3000/week5: Difference between revisions

The educational technology and digital learning wiki
Jump to navigation Jump to search
Line 10: Line 10:
== Monday ==
== Monday ==


=== Creating animations with the Greensock library ===
=== 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:
* [https://greensock.com/docs/#/HTML5/GSAP/TweenLite/ TweenLite] -handles animating just about any property of any object.
* [https://greensock.com/docs/#/HTML5/GSAP/TweenMax/ TweenMax] - adds some extras.
* [https://greensock.com/docs/#/HTML5/GSAP/TimelineLite/ TimelineLite]  a container for tweens to control them as a whole and precisely manage their timing in relation to each other
* [https://greensock.com/docs/#/HTML5/GSAP/TimelineMax/ 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:
<source lang="JavaScript">
<script src="https://cdnjs.cloudflare.com/ajax/libs/gsap/1.20.3/TweenMax.min.js"></script>
</source>


=== Hands on ===
=== Hands on ===


== Wednesday ==
== Wednesday ==

Revision as of 21:16, 15 April 2018

COAP:COAP-3000
◀▬▬▶
2018/04/15




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

Wednesday