TA的每日心情 | 奋斗 昨天 10:18 |
---|
签到天数: 2266 天 [LV.Master]伴坛终老
|
HTML5 的 Canvas 对象将改变 JavaScript 的使命,使之成为 HTML5 下强大的动画脚本编写工具。本文介绍了 8 个你从未见过的,基于 HTML5 Canvas 和 JavaScript 的动画,这些令人难以置信的效果将使你对 HTML5 彻底折服。需要指出的是,这些都是浏览器的原生动画,无需任何插件。Tunnelers
; o5 C% v; `3 |6 O( q' w6 ^/ y$ p2 B# X6 B) p( J8 K3 r+ |/ a
, N g# X9 z: w+ z
! z$ q+ O( v7 C# C1 t( i! s- A
纯 JavaScript + HTML5 Canvas 生成的交互动画,难以置信。
3 ]- ~( K3 x. S0 O
) `9 g# |# W; D0 F4 @1 G' O4 l5 d1 C2 C" n$ {4 h$ f' n, k
The Mesmerizer; T! v' ~% v, u. e) r6 j* U7 Z. F+ R
5 c" v t, ]& j- a
3 f- R. {* }6 j G f5 e, n
" Y! }$ Z9 l1 d# n
在格子中移动鼠标,颜色随着改变并扩散到周围的格子,很迷幻。用鼠标点四角的格子,或按键盘,可以看到更奇妙的效果。
+ s& h. h' F* _0 Z/ [6 J: g! W& J" P+ s1 U$ O% H4 ?+ q) C) C' V
Burn$ x. t; \0 b9 U/ q- r- y
2 Z5 t/ }+ q- m p8 t! d
8 y" r& A2 G- _: s, y" ?5 m1 p% w' ?7 j/ ^4 T
在页面上移动鼠标,或按下鼠标,这样的效果,很难相信是浏览器原生的。3 |& m) Q, A! w; E+ `7 S, B
& X+ F# F+ P5 z7 f1 U% F" \% U
Cheloniidae Live" I: ~8 C4 U% [" U" S$ k' D( Q
5 J* M4 D1 b. _$ g# `
8 J o0 W0 J0 d3 G' v- d; i
( W: O9 H, |0 o也是基于纯粹的 JavaScript,不过使用了一个 JavaScript 库。很有趣,你可以通过修改其 JavaScript 代码实现自己的效果(可惜被墙了)。) I- ^+ D( |4 m
* P: C4 h- a* I0 k1 a" @8 G6 u$ G) @
* j" f& b4 w3 _+ `- w4 O
Canvas 3D engine% P, p# G. {8 a8 i; T$ ^
. S: q/ t' O% i2 M7 g l: Z% V2 L
/ \. \( M# _9 g. I/ v% j$ H3 v8 W2 c a
一个基于 Canvas 的 3D 引擎。目前只支持预设的图形,纹理及基本交互功能。
8 ~0 O- T% M: S! r1 R; y+ Y6 z4 d0 q9 K0 D
, K4 F6 V' O' tBomomo/ |3 _0 ^, U4 x& E
2 d6 x1 |9 \- S6 l- G& s3 ~7 B! l7 B1 w; N7 C9 _$ j
; c8 [8 w( j' t3 K很值得一试。
* f4 P* {' L# N0 M
1 u7 Z; Y' y8 `# J) G2 W' c% R+ c" i6 c0 d
DDD1 |0 C0 [' m. F' R5 B
& r3 n# [# M' q. u E. O* j! } V" x$ B! V, i
# f. ]3 S T9 A7 j, v
这个交互动画也很有趣。0 R5 s F$ E* c: P
) H* K3 i) v% D" A4 a4 r( t' F& L7 C2 [0 |& O4 M( G/ b% u5 q
Plasma Tree2 O* I8 n4 Q# O) v$ H$ E! B
7 m+ \. e% l I0 v
]/ |7 S2 n2 \5 H. b& T8 T1 }2 I* M* d
非常阿凡达。 |
|