createjs的下载与使用

 

1.进入http://createjs.com/,提供了4个js分别是

       EASELJS:用于处理HTML5中的Canvas

       TWEENJS:用于处理HTML5动画处理和JS属性的

       SOUNDJS:用于处理音频相关的API

       PRELOADJS:用于处理程序的协调项和加载项的类库

  分别点击时也有简单的描述

2.点击下图中的DOWNLOAD

3.点击页面中的DOWNLOAD,如EaselJS-0.8.1.zip

CDN:最简单的版本,下载后可直接使用

COPY CDN URL:

GITHUB:源码,进入页面后点击“EASELJS”列进入https://github.com/CreateJS/EaselJS,可看到源码

4.EaselJS-0.8.1.zip解压后在目录docs\EaselJS_docs-0.8.1\index.html,index.html可查看帮助文档,

                                        目录 lib\easeljs-0.8.1.min.js将它拷贝到项目中引用。

5.示例,绘制文字

<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <title>认识CreateJS</title>
    <!--easeljs-0.7.1.min.js
    (一个JavaScript库,使使用HTML5 Canvas元素变得容易)
    -->
    <script src="easeljs-0.7.1.min.js"></script>
    <script>
        var mycanvas;
        var stag;
        var txt;
        var count=0;
        window.onload=function(){
            mycanvas=document.getElementById("mycanvas");
            stang=new createjs.Stage(mycanvas); //Stage相当于ctx.getcontext("2d")一个承载的舞台
            txt=new createjs.Text("number->","20px Arial","#ff7700");
            stang.addChild(txt);

            createjs.Ticker.setFPS(30);
            createjs.Ticker.addEventListener("tick",tick);
        }

        function tick(e){
            count++;
            txt.text="number->"+count+"!";
            stang.update();
        }
    </script>
</head>
<!--本课主要讲解认识createjs-->
<body>
     <canvas id="mycanvas" width="500px" height="500px"></canvas>
</body>
</html>

 

posted @ 2015-07-06 19:18  涂白浮华  阅读(2387)  评论(0编辑  收藏  举报