<!doctype html>
<html>
<head>
<meta charset="utf-8" />
<title>Snowy Tutorial</title>
<link href="main.css" rel="stylesheet" />
<script src="http://code.createjs.com/createjs-2013.12.12.min.js"></script>
<!-- This Tutorial was made by Andrea Kereliuk for Sheridan's IMM program, 2014-2015 -->
<script>
window.addEventListener("load", init);
function init() {
var stage = new createjs.Stage("myCanvas");
setInterval(snowBegin, 200);
function snowBegin() {
var snowflake = new createjs.Bitmap("snowflakeS.png");
var container = new createjs.Container();
container.addChild(snowflake);
container.x = Math.random()*window.innerWidth;
var duration = Math.random()*1000+1000;
createjs.Tween.get(snowflake, {loop:true})
.to({x:0, alpha:1}, createjs.Ease.quadInOut)
.wait(15)
.to({x:25, alpha:1}, duration, createjs.Ease.quadInOut)
.wait(15)
.to({x:0, alpha:1}, duration, createjs.Ease.quadInOut);
stage.addChild(container);
createjs.Tween.get(container, {loop:true})
.to({y:window.innerHeight}, 10000, createjs.Ease.BackOut)
.call(removeContainer);
createjs.Ticker.on("tick", stage).setInterval(5);
}
function removeContainer(e) {
stage.removeChild(e.target);
}
}
</script>
</head>
<body id="demo">
<canvas id="myCanvas">alternative content</canvas>
<script>
var canvas = document.getElementById("myCanvas");
canvas.width = window.innerWidth;
canvas.height = window.innerHeight;
</script>
<!-- CONTENT GOES HERE -->
</body>
</html>