lcg #007:1 (alt)

CreateJS - more animation

by dirkk0

HTML

<canvas id="canvas" width="300" height="200"></canvas>

CSS

canvas{
    border:1px solid #000000;
}

JavaScript

var stage = new createjs.Stage("canvas");

var c = new createjs.Graphics().f("#f00").dc(100, 100, 60)
var r = new createjs.Graphics().f("#ff0").dr(0, 0, 50, 50);

var s1 = new createjs.Shape(r);
var s2 = new createjs.Shape(c);

stage.addChild(s2);
stage.addChild(s1);


createjs.Ticker.addEventListener("tick", handleTick);
createjs.Ticker.setInterval(25);
createjs.Ticker.setFPS(40);

var dx = 7;
var dy = 5;

function handleTick() {
    s1.x += dx;
    s1.y += dy;
    if (s1.x > (stage.canvas.width - 50) ) {
        dx = -dx;
    }
    if (s1.x < 0) {
        dx = -dx;
    }
    if (s1.y > stage.canvas.height - 50) {
        dy = -dy;
    }
    if (s1.y < 0) {
        dy = -dy;
    }
    stage.update();
}