Collie——基于 HTML5 的高性能 JavaScript 动画库

  Collie 是一个 JavaScript 库,用于创建高度优化的 HTML5 动画和游戏。Collie 可以运行在 PC 和手机上,使用 HTML5 Canvas 和 DOM。Collie 能够多线程稳定的处理多个对象,支持很多实用的功能,包括精灵动画和用户事件。稳定支持 iOS 和 Android,并为每个平台的渲染提供优化的方法。

  

 

Demos

 

示例代码:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
<div id="container"></div>
  
<!-- Load script -->
<script type="text/javascript" src="http://jindo.dev.naver.com/collie/deploy/collie.min.js"></script>
<script type="text/javascript">
// Load the logo.png image
collie.ImageManager.add({
    "logo" : "http://jindo.dev.naver.com/collie/img/small/logo.png"
});
  
// Create layer
var layer = new collie.Layer({
    width : 320,
    height : 480
});
  
// Create object that will be displayed on the screen
var item = new collie.MovableObject({
    x : "center",
    y : "center",
    velocityRotate : 180,
    backgroundImage : "logo" // The background image is re-sized to the pre-loaded logo.png size
}).addTo(layer); // Add to layer
  
// Add layer to renderer
collie.Renderer.addLayer(layer);
  
// Retrieve renderer from the container ID element
collie.Renderer.load(document.getElementById("container"));
  
// Start rendering
collie.Renderer.start();
</script>

 

源码下载

帮助文档

 

浏览器兼容

  PC:ie9+(ie6~8 no-transform-support), chrome, firefox, safari, opera
  Mobile OS:iOS4+, Android2.1+, WindowsMobile 7.5+

 

您可能感兴趣的相关文章

 

 

本文链接:Collie——基于 HTML5 的高性能JavaScript动画库

编译来源:梦想天空 ◆ 关注前端开发技术 ◆ 分享网页设计资源

posted @   梦想天空(山边小溪)  阅读(15666)  评论(6编辑  收藏  举报
编辑推荐:
· 大模型 Token 究竟是啥:图解大模型Token
· 35岁程序员的中年求职记:四次碰壁后的深度反思
· 继承的思维:从思维模式到架构设计的深度解析
· 如何在 .NET 中 使用 ANTLR4
· 后端思维之高并发处理方案
阅读排行:
· BotSharp + MCP 三步实现智能体开发
· BotSharp 5.0 MCP:迈向更开放的AI Agent框架
· 5. RabbitMQ 消息队列中 Exchanges(交换机) 的详细说明
· 【ESP32】两种模拟 USB 鼠标的方法
· 设计模式脉络
历史上的今天:
2011-12-17 丝带(Ribbon)在网页设计中应用的20佳优秀案例
点击右上角即可分享
微信分享提示