TweenLite advanced
Animating more properties of shape objects using TweenLite.js
// This example requires you to add TweenLite.js and Easepack.js to your HTML file. var r = new Rune({ container: "#canvas", width: 800, height: 600 }); // start the circle at the top of the screen var circ = r.circle(r.width/2, -50, 30) .stroke(false) .fill(30); // animate it to the middle of the screen TweenLite.to(circ.state, 2, { y:r.height/2, radius:80, delay:2, ease: Elastic.easeOut, onUpdate: function() { circ.changed() }, onComplete:finished }); function finished() { console.log("animation finished") } r.play();
< Back to examples