JSDK Example

TWEEN ANIMATION

Events

Listen an animation with events.

name	parameters
starting	(this: Anim, e: CustomEvent)
finished	(this: Anim, e: CustomEvent)
pausing	(this: Anim, e: CustomEvent)
paused	(this: Anim, e: CustomEvent)
looping	(this: Anim, e: CustomEvent, loop: number)
looped	(this: Anim, e: CustomEvent, loop: number)
updating	(this: Anim, e: CustomEvent, elapsedTime: number, duration: number, loop: number)
updated	(this: Anim, e: CustomEvent, elapsedTime: number, duration: number, loop: number)

CODE EXAMPLE

let anim = new TweenAnim({
    keys: {
            translateX: 250
        },
        direction: 'alternate',
        loop: true,
        duration: 10000
}).targets($L('.el')).on('updated', (e, t, d, i)=>{
    $1('.label').innerHTML = `loop: ${i}, progress: ${Number(t/d*100).round(0)}%`
}).on('paused', ()=>{
    $1('.label').innerHTML += ' PAUSING...'
})