Source code
<script> var stage, timeCircle; function init() { stage = new createjs.Stage("demoCanvas"); timeCircle = new createjs.Shape(); timeCircle.graphics.beginFill("red").drawCircle(0, 0, 40); timeCircle.y = 50; stage.addChild(timeCircle); // Mostly same as example 0.1 however didn't set the x because it will be altered in tick function createjs.Ticker.addEventListener("tick", tick); // Add a "tick" event so that the function tick(){...} runs periodically same as 0.2 createjs.Ticker.framerate=60; // Set to 60 frames per second } function tick(event) { // time based timeCircle.x = timeCircle.x + (event.delta)/1000*100; // event.delta means how much time has past since the last tick if (timeCircle.x > stage.canvas.width) { timeCircle.x = 0; } // set the circle back to the left side if it's off screen stage.update(); } </script> <canvas id="demoCanvas" width="500" height="200"> alternate content </canvas> <script> init(); </script>