TA的每日心情 | 奋斗
2 小时前 |
|---|
签到天数: 2397 天 [LV.Master]伴坛终老
|
HTML5 的 Canvas 对象将改变 JavaScript 的使命，使之成为 HTML5 下强大的动画脚本编写工具。本文介绍了 8 个你从未见过的，基于 HTML5 Canvas 和 JavaScript 的动画，这些令人难以置信的效果将使你对 HTML5 彻底折服。需要指出的是，这些都是浏览器的原生动画，无需任何插件。Tunnelers
- {! @; Y. M& d+ [( y3 e
7 i( H7 x) I0 [. z! ^![]() . d9 z) p5 u" Y5 [$ ?
( v* l. r3 ?2 I+ z9 F, V V纯 JavaScript + HTML5 Canvas 生成的交互动画，难以置信。
. `2 ~: u$ q& z0 M2 c( s$ y" Q* W
) \+ Q4 r6 w9 J
The Mesmerizer! u* s0 x! o, b3 I& M
4 c) E9 O1 x( D4 F![]()
1 T5 J0 L8 X' E/ T# Y' ]$ B$ X/ h/ h1 n! l$ O
在格子中移动鼠标，颜色随着改变并扩散到周围的格子，很迷幻。用鼠标点四角的格子，或按键盘，可以看到更奇妙的效果。8 g* v" P1 W: L$ \7 \
7 B0 b4 d, _7 D7 Z
Burn L* y% |- h5 j% V6 x( i
![]()
* f$ v' U4 ^# o* `( h4 |" Z h, J, w2 M4 i
3 @# I& l% }7 O( _- j' q# n& X
在页面上移动鼠标，或按下鼠标，这样的效果，很难相信是浏览器原生的。
) \. z: M8 H; R9 k# v2 k6 f8 U( n6 M
Cheloniidae Live! D0 ~6 R$ |/ R, s
4 J& Q* ^7 w9 }; [0 @. c; T
![]()
8 }/ N8 \( i( B0 r. N: `) M! O/ O! x/ L' R8 |$ |
也是基于纯粹的 JavaScript，不过使用了一个 JavaScript 库。很有趣，你可以通过修改其 JavaScript 代码实现自己的效果（可惜被墙了）。
' K) N/ l$ T2 `5 P3 T: i+ M* Q5 a5 O0 Y* P: L' }
8 |1 F2 F3 P6 T# b4 a6 T
Canvas 3D engine
6 H, f4 P" ~. W( k* g4 J$ T" d. E5 T8 h2 V! w# h2 i- w
![]() % @& U1 o, j) w) o/ r) X u) q
p% v9 N% j) h* ^& ?" L) b
一个基于 Canvas 的 3D 引擎。目前只支持预设的图形，纹理及基本交互功能。7 q& b# O0 s. ]
5 P! R+ q! F' H% Q8 V: v' v
9 D: W6 L4 G: X5 Q- o: EBomomo
! r' \- V4 `5 {, B( }/ Y
, G9 y3 M3 B. q7 k![]()
" o9 Y8 h& A) {& q
. |- D6 y& `, _% ~3 U" \2 O/ x很值得一试。
$ r+ _) s; R9 ~$ A2 l, u
! d- X5 M8 V" w7 @' C4 {& p1 Y! c5 {/ A; j. h) n
DDD4 t4 m! k5 t s3 S
' x+ y& ^. h# o% i2 y
![]()
! v# H# [; X9 w* }
/ v5 ]4 s! d+ ?这个交互动画也很有趣。
' F2 n5 t, s) C5 a4 `$ r
# g' ~! t9 g. \. |3 Y
3 d ` [6 D- Q) _Plasma Tree7 s( v0 A% @. ~$ \" F& k
3 u( M( I0 _3 ?/ x4 L![]()
& u" ]4 M4 ]( y5 f1 g2 {; t
5 y* G/ q( y# g2 Q非常阿凡达。 |
|
/1 
IP卡
狗仔卡
发表于 2010-6-28 14:49:28
QQ好友和群
QQ空间
腾讯微博
腾讯朋友
收藏
分享
顶
踩
提升卡
置顶卡
沉默卡
喧嚣卡
变色卡
抢沙发
千斤顶
显身卡
发表于 2010-7-22 10:35:25