2、CreateJS介绍-TweenJS
需要在html5文件中引入的CreateJS库文件是easeljs-0.7.1.min.js和tweenjs-0.5.1.min.js
HTML5文件如下:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>2、CreateJS介绍-TweenJS</title>
<script src="easeljs-0.7.1.min.js"></script>
<script src="tweenjs-0.5.1.min.js"></script>
</head>
<body>
<canvas id="gameView" width="400px" height="400px" style="background-color:lightgreen;"></canvas>
<script src="app.js"></script>
</body>
</html>
在HTML5文件中引入的app.js文件源码如下:
/**
* create 2、CreateJS介绍-TweenJS-app.js by dpp on 2016/1/4
* @authors Your Name (you@example.org)
* @date 2016-01-04 01:13:34
* @version $Id$
*/ var stage = new createjs.Stage('gameView'); stage.x = 100; stage.y = 100; var circle = new createjs.Shape(); circle.graphics.beginFill('red').drawCircle(0,0,50); stage.addChild(circle); createjs.Tween.get(circle,{loop:true})
.wait(1000)
.to({scaleX:0.2,scaleY:0.2})
.wait(1000)
.to({scaleX:1,scaleY:1},1000,createjs.Ease.bounceInout) createjs.Ticker.setFPS(20);
createjs.Ticker.addEventListener('tick',stage);
例子"2、CreateJS介绍-TweenJS"的源码地址:https://github.com/daipianpian/CreateJS-Study/tree/master/1%E3%80%81CreateJS%E4%BB%8B%E7%BB%8D/L02_TweenJS
2、CreateJS介绍-TweenJS的更多相关文章
- 4、CreateJS介绍-PreLoadJS
需要在html5文件中引入的CreateJS库文件是preloadjs-0.4.1.min.js HTML5文件如下: <!DOCTYPE html> <html lang=&quo ...
- 3、CreateJS介绍-SoundJS
需要在html5文件中引入的CreateJS库文件是soundjs-0.5.2.min.js HTML5文件如下: <!DOCTYPE html> <html lang=" ...
- 1、CreateJS介绍-EaselJS
需要在html5文件中引入的CreateJS库文件是easeljs-0.7.1.min.js HTML5文件如下: <!DOCTYPE html> <html lang=" ...
- CreateJS介绍-了解CreateJS
1.CreateJS 一款HTML5游戏开发引擎 CreateJS 是一套可以构建丰富交互体验的 HTML5 游戏的开源工具包,旨在降低 HTML5 项目的开发难度和成本,让开发者以熟悉的方式打造更具 ...
- CreateJs入门必知必会
CreateJS介绍 CreateJS是基于HTML5开发的一套模块化的库和工具.基于这些库,可以非常快捷地开发出基于HTML5的游戏.动画和交互应用.CreateJS主要包含如下四个类库: Ease ...
- Tween公式 以及四个参数
Tween的主页在这里:http://createjs.com/tweenjs , 这里边还有挺多开源项目的: Tween公式 4个参数 t:current time(当前时间) b:beginnin ...
- Omi 拥抱 60FPS 的 Web 动画
写在前面 Omi 框架 正式发布了 → omi-transform. Made css3 transform super easy. Made 60 FPS easy. 作为 Omi 组件化开发特效运 ...
- TweenJS----前端常用的js动画库,缓动画和复制动画的制作,效果非常好。
TweenJS类库主要用来调整和动画HTML5和Javascript属性,提供了简单并且强大的tweening接口. http://www.createjs.cc/tweenjs/ http://ww ...
- CreateJSのTweenJS、SoundJS、PreloadJS
TweenJS基础实例: var canvas = document.getElementById('myCanvas'), stage = new createjs.Stage(canvas); v ...
随机推荐
- 解读 CSS 布局之水平垂直居中
对一个元素水平垂直居中,在我们的工作中是会经常遇到的,也是CSS布局中很重要的一部分,本文就来讲讲CSS水平垂直居中的一些方法.由于我们大搜车的日常工作中已经不再需要理会低版本IE,所以本文所贴出的方 ...
- JS如何定义方法及调用 精选
简单搜索了下,遇到点问题1,经常在JS中看到如var foo = function(){}的形式foo是方法名还是对象名,如果想调用此方法,是用foo(),foo.function(),还是该如何正确 ...
- redis简介及安装
1 redis简介及安装 1.1 Redis是什么 REmote DIctionary Server(Redis) 是一个由Salvatore Sanfilippo写的key-value存储系统. 首 ...
- BZOJ 1041 [HAOI2008]圆上的整点:数学【费马平方和定理】
题目链接:http://www.lydsy.com/JudgeOnline/problem.php?id=1041 题意: 给定n(n <= 2*10^9),问你在圆x^2 + y^2 = n^ ...
- 分享知识-快乐自己:什么是MVC
1.什么是mvc: Model View Controller,是模型-视图-控制器的缩写,一种软件设计典范,用一种业务逻辑.数据.界面显示分离的方法组织代码,将业务逻辑聚集到一个组件里,在改进和个性 ...
- 数据可视化入门之show me the numbers
数据的可视化一直是自己瞎玩着学,近来想系统的学数据可视化的东西,于是搜索资料时看到有人推荐<show me the numbers>作为入门. 由于搜不到具体的书籍内容,只能 ...
- 【LeetCode】Reverse Words in a String 反转字符串中的单词
一年没有管理博客园了,说来实在惭愧.. 最近开始刷LeetCode,之前没刷过,说来也实在惭愧... 刚开始按 AC Rates 从简单到难刷,觉得略无聊,就决定按 Add Date 刷,以后也可能看 ...
- Django 模板 自定义context_processors
Django版本 1.8.4 为什么要自定义context_processors 在做博客的过程中,在浏览排行,评论排行,标签,文章归档,友情链接等内容每一个显示页面都是要显示的.如果在每一个view ...
- boost库安装和使用
1. 下载最新的boost库:http://www.boost.org/本文使用的是boost_1_66_0.tar.gz, 2. Boost库安装步骤: > 解压下载文件,例如下载文件在~/D ...
- 基于STM32的uCGUI移植和优化
基于STM32的uCGUI移植和优化 首先在开始这个说明之前,要简要说明下具体的环境: 编译工具:MDK4.20 开发板:安富莱v2版开发板 调试器:JLink v8盗版 移植篇 相信大家有移植经验 ...