标签 / 动画
HTML5 CANVAS动画制作误区
最近在做一个HTML5游戏,过程有些艰难,然后今天灵光一现,发现自己陷入了一些误区。1、并不是所有的动画效果都得在同一个canvas中实现,可以结合html的其他标签以及css3一起实现。比如游戏的角色面板、人物对白等,这些用div+css就是一件很容易实现的事,只需要js简单的调用调出即可,如果用canvas去画,反而陷入困境。2、进度条是一定要有的。...  阅读全文 »
HTML5 Canvas JavaScript框架KineticJS
KineticJS是一款开源的HTML5 Canvas JavaScript框架,能为桌面和移动应用提供高性能动画,并具有转场效果、节点嵌套、分层、滤镜、缓存以及事件处理等更多功能。即使你的应用包含了成千上万的图形,也可以为你所绘制的东西添加事件监听器,或是对它们进行移动、缩放操作,为了支持高性能动画,还可以独立于其他图形对它们进行旋转。 KineticJS的最新版已经更新至5.1.0,相...  阅读全文 »
EaselJS:实例练习
几个实例演示:线条练习图形练习图片练习图片模糊擦除效果...  阅读全文 »
EaselJS:制作卡通人物四方行走HTML5动画
在线演示:http://blog.cxycs.com/demos/girl/源码下载:http://blog.cxycs.com/demos/girl.rar学习HTML5基础有一段时间,但一直没有入门,直到阅读这篇文章《创造一款成功HTML5游戏的完整指南》,然后知晓了EaselJS框架的存在。就学习一个新的领域时,也许先学习框架,再入手基础,可能更有效。下面是一个小女孩的四方行走的代码实现:首...  阅读全文 »
EaselJS:第一个HTML5动画游戏
继上一个《第一个HTML5动画》之后,又进一步练习了HTML5 Canvas上的多个精灵操作,并选择了坦克大战作为实例,游戏地址《The Tank War》。源码及开发过程会在之后几天在笔记栏目展示。源码下载:http://blog.cxycs.com/demos/tank.rar向HTML5又前进了一步...  阅读全文 »
EaselJS:第一个HTML5动画
学HTML5有一段时间了,看了好几本书,基础深深浅浅的过了好几遍,但是感觉一直不得其门而入。前几天看到一篇文章介绍了EaselJS这个HTML5框架,觉得从框架入手HTML5应该是一个好的方法。学习了几天后,做出了第一个基于帧图的HTML5动画。演示地址:http://blog.cxycs.com/demos/girl/ 这算不算一个进步...  阅读全文 »