阅读更多

19顶
2踩

Web前端

翻译新闻 你从没见过的 HTML5 动画效果

2010-06-28 18:04 by 副主编 just_cool 评论(21) 有29082人浏览

HTML5 的 Canvas 对象将改变 JavaScript 的使命,使之成为 HTML5 下强大的动画脚本编写工具。本文介绍了 8 个你从未见过的,基于 HTML5 Canvas 和 JavaScript 的动画,这些令人难以置信的效果将使你对 HTML5 彻底折服。需要指出的是,这些都是浏览器的原生动画,无需任何插件。

 

Tunnelers

纯 JavaScript + HTML5 Canvas 生成的交互动画,难以置信。

The Mesmerizer

在格子中移动鼠标,颜色随着改变并扩散到周围的格子,很迷幻。用鼠标点四角的格子,或按键盘,可以看到更奇妙的效果。

 

Burn


在页面上移动鼠标,或按下鼠标,这样的效果,很难相信是浏览器原生的。

Cheloniidae Live

也是基于纯粹的 JavaScript,不过使用了一个 JavaScript 库。很有趣,你可以通过修改其 JavaScript 代码实现自己的效果(可惜被墙了)。

 

Canvas 3D engine

一个基于 Canvas 的 3D 引擎。目前只支持预设的图形,纹理及基本交互功能。

 

Bomomo

很值得一试。

 

DDD

这个交互动画也很有趣。

Plasma Tree

非常阿凡达。

 

本文国际来源:queness.com 8 Simply Amazing HTML5 Canvas and Javascript Animations (原文作者 kevin

 

中文翻译来源:锐商企业CMS 网站内容管理系统 官方网站

19
2
评论 共 21 条 请登录后发表评论
21 楼 shipeng2436 2010-08-25 17:38
我的CPU还不是很高,效率可以了,比flash高.
20 楼 Lingoesforstudy 2010-07-01 14:49

能写出这个的人也真是太牛了!

佩服,佩服!
19 楼 greatghoul 2010-06-30 08:48
这简直太神奇了,如此的效果,不知道未来的有一天,有没有可能开发出来浏览器里面的h-game,期待呀。
18 楼 hite 2010-06-29 21:28
Plasma Tree 里有个flowerpower效果超赞,,学点数学还是有用的
17 楼 wangxinpier 2010-06-29 18:20
用chrome运行,效果非常的不错.....超好.
16 楼 MrPengPeng 2010-06-29 17:03
目前版本的浏览器都那个 支持 这种标签!!
15 楼 takuma888 2010-06-29 14:00
拜托能不能不用这样的标题?动不动就是“你从没见过的什么”,我看只是作者自己从没见过。
这些东西在http://www.chromeexperiments.com/全都有收,可能需要梯子。
14 楼 wcily123 2010-06-29 13:56
ie9 开始支持 html5
:-)
13 楼 leepengyu 2010-06-29 13:15
为什么是HTML5应用 但是查看源代码却有很多div标签?
不是说HTML5去掉div了吗?
12 楼 java318 2010-06-29 10:40
这样的动画用flash实现需要多少多长时间,用html5需要多长时间。不实用。
11 楼 ywg2008 2010-06-29 09:21
太占CPU了!
10 楼 thorlst 2010-06-29 09:09
javagui 写道
Bomomo,这个IE8能运行。呵呵

你看到的是flash.
9 楼 wiflish 2010-06-29 09:07
奇怪。。我的CPU占用不到50%。 用的Firefox3.6.6
8 楼 左看右看 2010-06-29 00:54
    CPU的占用是很高,比flex还站cpu,不过我看好html5的,好不容易找找到一些例子!看下!不过真正实施还是要很长的时间!
7 楼 javagui 2010-06-28 22:23
lizp 写道
CPU 占用率太高


不知道开一个浏览器CPU怎么样,我5个主流浏览器都开了,电脑很慢
6 楼 javagui 2010-06-28 22:22
ablackrock 写道
javagui 写道
Bomomo,这个IE8能运行。呵呵

是可以,不过是 flash 的...

。。。不说什么了,难得一个可运行的网站,还TM flash,赶紧IE9吧!!
5 楼 ablackrock 2010-06-28 21:16
为了让你的 HTML5 代码兼容各个浏览器,你会火冒 3x5=15 丈...
4 楼 ablackrock 2010-06-28 21:13
javagui 写道
Bomomo,这个IE8能运行。呵呵

是可以,不过是 flash 的...
3 楼 somefuture 2010-06-28 20:01
我的ie8全运行不了,火狐都可以的。
2 楼 lizp 2010-06-28 19:17
CPU 占用率太高

发表评论

您还没有登录,请您登录后再发表评论

相关推荐

  • ADODB.Connection对象的Execute方法

    通常 应该这样用conn.execute(sql) ,conn也就是一个ADODB.Connection对象的实例。 ADO是Active Data Object的缩写,称为ActiveX数据对象。利用ADO对象,通过ODBC驱动程序或OLE DB连接字符串,可实现对任意数据库的存取和访问。   OLE DB是微软用来替代ODBC的一种数据库访问技术。是一种对关系型数据库和非关系型数据库均

  • 如何在ado中使用connection 对象?

    <br />如何在ado中使用connection 对象?<br />什么是connection对象?<br />一个connection对象描述了到数据源的物理连接。你可以使用odbc也可以利用ole db来连接数据源。当你打开一个connectiont对象时你就会试图连接数据库。Connection对象的state属性会告诉我们连接是否成功。通过connection对象的execute方法向数据源发送SQL语句或运行存存储过程。如果你向数据源发送的命令要求数据源返回记录集,那么记录集对象会自动的被创建。

  • 关于VB访问数据库的一些经验(献给VB初学者)

    VB作为一个高效快捷的开发工具而言,在数据库开发上有着很好的表现。但是,对于很多初学者而言,入门时经常会看一些并非高效且封装得更加多的代码作为学习参考(如那种用什么控件、数据捆绑之类的范例代码),导致很多多初学者想深入时会更加茫然。其实,曾经很多用VB开发的数据库商用软件都不会用那种方法,因为弊病很多,效率也不高。先总结一下为什么说用数据控件效率不高。首先,作为数据库操作的对象而言,是不需要有用户...

  • 关于使用ADODB.Connection (0x800A0E7A) 未找到提供程序。该程序可能未正确安装 错误的解决办法...

    最近用vc写了一个小东西,需要操作access,就用了ado,开发好的程序在5台电脑上有2台会报 "ADODB.Connection (0x800A0E7A) 未找到提供程序。该程序可能未正确安装" 这个错误,在网上查了N多资料,尝试了N多种方法,都未能解决,最后发现只要简单的一个操作,就能解决问题, 开始---&gt;运行 输入 regsvr32 msjetoledb40.dll, 回车。 然...

  • Python连接Access数据库遇到问题'ADODB.Connection', '未找到提供程序。该程序可能未正确安装。'的处理办法...

    环境Windows7+python3.6.4x64位+AccessDatabaseEngine_X64.exe,执行代码: import win32com.client conn = win32com.client.Dispatch(r'ADODB.Connection') DSN="Provider=Microsoft.Jet.OLEDB.4.0;Data Source=E:/...

  • ADO操作及其参数介绍 

    ADO操作及其参数介绍 1. ASP与Access数据库连接:dim conn,mdbfilemdbfile=server.mappath("数据库名称.mdb")set conn=server.createobject("adodb.connection")conn.open "driver={microsoft access driver (*.mdb)};uid=admin;pwd=数据

  • 粗谈使用ADO接口连接数据库

    在这个工程中使用ADO接口进行数据库应用程序开发所得到的程序是一个单击按钮后在列表框里显示所要查看的数据库里所有的表名。简要步骤如下:1、新建一个基于对话框的应用程序,工程名取为adodatabase。2、向窗体中添加一个EidtBox控件、一个ListBox控件、一个Button控件。3、为编辑框和列表框连接变量m_edit和m_list,为对话框类CAdodatabaseDlg添加 _Reco

  • 在VB中使用水晶报表的一种简易编程方法之二(转)

       第二步:    点击Crystal Report设计器的"数据库字段",选定"数据库专家…",然后点"创建新连接",再点"仅字段定义",创建"数据库定义"文件,字段名和宽度和原数据库表保持一致。最后,在数据库字段中获得了相...

  • U8API——向U8数据库表导入数据

    一、打开API资源管理器 替换两个引用 打开应用实例,选择相应的功能 复制相应的封装类到自己的目录下 在数据库新建临时表,与目标表相同 数据导入: 思路:先将要导入的数据导入到与U8目标表相同的临时表,再用API从临时表导入到U8目标表 //导入临时表-产成品入库、销售发货 public void ImportU8RdDis()...

  • ConnectionString属性详解(连接字串)

    .NET SQL Server连接字符串句法     在对象实例化或者建立期间,数据库连接字符串通过属性或方法被传递到必要的对象。连接字符串的格式是一个以分号为界,划分键/值参数对的列表。列表A中包括了一个C#中的例子,说明了怎样用创建SqlConnection对象的方法连接到

  • ADO.Net的对象模型

    ADO.Net的对象模型,包括以下七个对象。Connection.Command,Parameter,Recordset,Field,Property,Error.此外,还包括四个集合,Fields,Properties,Parameters,Errors.这几个对象的功能如下:Connection对象提供与包含路径,口令和连接选项的数据源的链接;Command对象保存一个针对数据源的将被

  • (ASP)利用VB封装ADODB.Connection保护数据库连接信息

    (ASP)利用VB封装ADODB.Connection保护数据库连接信息1、创建ActiveX Dll2、更改工程名和类名分别为DbActiveX和GetConn3、VB中要进行工程->引用其实主要是引用Active Server Pages Object Library及Microsoft ActiveX Data Object 2.8 Library

Global site tag (gtag.js) - Google Analytics