码迷,mamicode.com
首页 > Web开发 > 详细

createjs的下载与使用

时间:2015-07-06 21:30:57      阅读:300      评论:0      收藏:0      [点我收藏+]

标签:

 

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>

 

createjs的下载与使用

标签:

原文地址:http://www.cnblogs.com/tubaifuhua/p/4625151.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!