 TA的每日心情 | 擦汗
昨天 14:55 |
|---|
签到天数: 2372 天 [LV.Master]伴坛终老
|
HTML5 的 Canvas 对象将改变 JavaScript 的使命，使之成为 HTML5 下强大的动画脚本编写工具。本文介绍了 8 个你从未见过的，基于 HTML5 Canvas 和 JavaScript 的动画，这些令人难以置信的效果将使你对 HTML5 彻底折服。需要指出的是，这些都是浏览器的原生动画，无需任何插件。Tunnelers/ |2 ~1 t; R! R8 q4 F
( F0 o% ^/ P2 D2 c9 F![]() 6 b" q, D2 {. s* o e
; D' C5 E/ S3 W. i
纯 JavaScript + HTML5 Canvas 生成的交互动画，难以置信。& S4 k" b! n j0 }& k' z
3 t" h! {, w. J) l" p2 m" A
7 ~( W) G7 V( G. EThe Mesmerizer, A! V0 E" `' ~# [ u9 p$ O1 }
; d! ?% X, B; s: \. I# {
![]() 9 \% N* Q) R) E- F( [, b, e& F
# u5 U0 c# ] m, K/ X T在格子中移动鼠标，颜色随着改变并扩散到周围的格子，很迷幻。用鼠标点四角的格子，或按键盘，可以看到更奇妙的效果。
T# Y7 t# x+ \' m0 z7 e& k( ]7 z% {1 d
Burn
: G8 k5 d6 {) M2 Z. M![]() n4 |1 ~' j6 s G
4 B, A9 k; G6 K! S1 I5 n5 J' G
0 O( }& o+ S" Q' H6 L/ p" P" U在页面上移动鼠标，或按下鼠标，这样的效果，很难相信是浏览器原生的。
# d, t! j# U- {6 ?! \3 l. V X; @+ ~$ z h- q. X: N( H/ E) s
Cheloniidae Live. X# z7 {2 _* v6 }
: U3 z C% z i7 ~9 `
![]() + f" X0 l# d& H( l& H0 J& R
3 v1 Y3 W& ~ C3 ~
也是基于纯粹的 JavaScript，不过使用了一个 JavaScript 库。很有趣，你可以通过修改其 JavaScript 代码实现自己的效果（可惜被墙了）。" q( }2 }; p9 M
& G( o1 S# M' W0 N; |
2 t7 e" b. y# q, O0 j$ }: H% GCanvas 3D engine
; C4 n1 I3 n: m
# t( ?( Z) a. {% P9 r1 o5 _7 a![]()
( ~& R, K+ l4 v. z! t q; D6 {' g; D$ d$ K6 n+ k
一个基于 Canvas 的 3D 引擎。目前只支持预设的图形，纹理及基本交互功能。; o3 v- g( n5 D* W. h/ j3 U
5 ^! b; ~ S5 S* I3 q
6 t! i9 u# q" C4 U ZBomomo
/ T! }9 O4 o: Z1 @" R) p+ x' N8 h- J0 F: G0 T8 c4 [
![]()
2 s8 X F) s+ ?: R e2 J" a7 q! I( w$ b- U
很值得一试。6 U ^ l. ?! s/ C0 _3 X
- X9 W; f+ m$ W) t1 k: X" F) c
6 O p7 J1 Y9 `DDD K/ _8 a6 V) l% _. ~. G
8 Y6 p5 w: r5 q9 e5 M$ f
![]()
3 L; L: y: t( w/ q& Y, L/ H2 d: v3 x! J7 @; T& l; e3 L9 l
这个交互动画也很有趣。
" k. a; j/ c/ J6 B/ b; o$ Y7 D/ ` ?
6 q: K d' Q' g: q& g1 t6 o
Q! T5 k9 s) q! A! `Plasma Tree
7 E, H# _# _2 l9 u
- f7 I4 L l; W0 B( I( a' V![]() " P. o, N9 M* z
9 K- @3 Z/ O; Y9 H$ C, S
非常阿凡达。 |
|
/1 
IP卡
狗仔卡
发表于 2010-6-28 14:49:28
QQ好友和群
QQ空间
腾讯微博
腾讯朋友
收藏
分享
顶
踩
转发到微博
提升卡
置顶卡
沉默卡
喧嚣卡
变色卡
抢沙发
千斤顶
显身卡
发表于 2010-7-22 10:35:25