Clone Click

by lannymcnie

HTML

<script src="https://code.createjs.com/createjs-2015.11.26.combined.js"></script>
<canvas id="canvas" width="800" height="600"></canvas>

JavaScript

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

var img = document.createElement("img");
img.onload = init;
img.crossOrigin = "Anonymous";
img.src = "https://upload.wikimedia.org/wikipedia/en/0/02/Homer_Simpson_2006.png";

function init() {
	var bmp = new createjs.Bitmap(img);
  stage.addChild(bmp);
  var b = bmp.getBounds();
  
  var s = new createjs.Shape();
  s.graphics.beginLinearGradientFill(["#000","#09C"], [0, 1], 0, 0, b.width*4, b.height)
  	.drawRect(b.x, b.y, b.width*4, b.height);
  s.compositeOperation = "source-in"
  
  stage.addChild(bmp, s);
  stage.update();
  
	createjs.Tween.get(s, {bounce:true, loop:-1})
		.to({x:-b.width*3}, 2000)
    .to({x:0}, 2000);
  
}

createjs.Ticker.on("tick", stage);