TweenLite is an extremely fast, lightweight, and flexible animation tool that serves as the foundation of the GreenSock Animation Platform (GSAP), available in JavaScript, AS2, AS3. A TweenLite instance handles tweening one or more properties of any object (or array of objects) over time. TweenLite can be used on its own to accomplish most animation chores with minimal file size or it can be use in conjuction with advanced sequencing tools like TimelineLite or TimelineMax to make complex tasks much simpler. With scores of other animation frameworks to choose from, why consider the GSAP?
GreenSock Docs
Back to Docs Home (v2)
TweenLite
Constructor
Properties
Methods
.delay()
TweenLite.delayedCall()
.duration()
.endTime()
.eventCallback()
TweenLite.from()
TweenLite.fromTo()
TweenLite.getTweensOf()
.invalidate()
.isActive()
.kill()
TweenLite.killDelayedCallsTo()
TweenLite.killTweensOf()
TweenLite.lagSmoothing()
.pause()
.paused()
.play()
.progress()
TweenLite.render()
.restart()
.resume()
.reverse()
.reversed()
.seek()
TweenLite.set()
.startTime()
.time()
.timeScale()
TweenLite.to()
.totalDuration()
.totalProgress()
.totalTime()
TweenLite
TweenLite()
.TweenLite( target:Object, duration:Number, vars:Object ) ;
TweenLite Constructor creates a tween.
Parameters
target: Object
Target object (or array of objects) whose properties should be affected. When animating DOM elements, the target can be: a single element, an array of elements, a jQuery object (or similar), or a CSS selector string like “#feature” or “h2.author”. GSAP will pass selector strings to a selector engine like jQuery or Sizzle (if one is detected or defined through TweenLite.selector), falling back to document.querySelectorAll().
duration: Number
Duration in seconds (or frames if useFrames:true is set in the vars parameter)
vars: Object
An object defining the end value for each property that should be tweened as well as any special properties like onComplete, ease, etc. For example, to tween mc.x to 100 and mc.y to 200 and then callmyFunction, do this:
new TweenLite(mc, 1, {x:100, y:200, onComplete:myFunction}).
Learn more about the properties that can be passed into the vars object below.
Show More
