CreateJS是基於HTML5開發的一套模塊化的庫和工具。
基於這些庫，可以非常快捷地開發出基於HTML5的遊戲、動畫和交互應用。
這裏我引用cdn上的鏈接；
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<script src="https://code.createjs.com/createjs-2015.11.26.min.js"></script>
</head>
<body>
<canvas id="canvas" width="500" height="500"></canvas>
<script src="app.js">
//這裏寫主要的代碼
</script>
</body>
</html>計劃寫一個自增的小效果，最初我們將創建canvas畫布，承載畫布的舞臺stage和需要展示的文字：
var canvas,stage,txt;window.onload=function(){
// 獲取畫布canvas=document.getElementById("canvas");
// 獲取舞臺
stage=new createjs.Stage(canvas);
//創建文字和相關樣式
txt=new createjs.Text("number-0>","20px Arial","#ff7700");
//將文字掛載到舞臺上
stage.addChild(txt);
//設定文字變化的頻率
createjs.Ticker.setFPS(30);
//創建事件，這裏將調用tick事件 createjs.Ticker.addEventListener("tick",tick);
}接下來就是寫tick事件
var count=0;
function tick(e){
count++;
txt.text="number->"+count+"!";
stage.update();
}這裏的tick主要負責文字的自增；
爲了演示，我封裝成點擊按鈕開始動畫，畫布爲銀色；
var canvas,stage,txt;
var starBtn=document.getElementById("startBtn");
window.onload=function(){
starBtn.addEventListener("click",startIncrease);
}
function startIncrease(){
canvas=document.getElementById("canvas");
stage=new createjs.Stage(canvas);
txt=new createjs.Text("number-0>","20px Arial","#ff7700");
stage.addChild(txt);
createjs.Ticker.setFPS(30);
createjs.Ticker.addEventListener("tick",tick);
}
var count=0;
function tick(e){
count++;
txt.text="number->"+count+"!";
stage.update();
}以下是效果：
以上只是一個簡單的小demo；具體用法和實例請訪問createjs的官網:http://www.createjs.com/