2013-10-7 藍(lán)藍(lán)設(shè)計(jì)的小編
轉(zhuǎn)載藍(lán)藍(lán)設(shè)計(jì)( www.gerard.com.cn )是一家專(zhuān)注而深入的界面設(shè)計(jì)公司，為期望卓越的國(guó)內(nèi)外企業(yè)提供有效的 BS界面設(shè)計(jì) 、 cs界面設(shè)計(jì) 、 ipad界面設(shè)計(jì) 、 包裝設(shè)計(jì) 、 圖標(biāo)定制 、 用戶(hù)體驗(yàn) 、交互設(shè)計(jì)、 網(wǎng)站建設(shè) 、平面設(shè)計(jì)服務(wù)
來(lái)源：http://www.cnblogs.com/lhb25//lhb25/archive/2011/08/09/awesome-html5-and-javascript-effects.html
如果您想訂閱本博客內(nèi)容，每天自動(dòng)發(fā)到您的郵箱中， 請(qǐng)點(diǎn)這里
這篇文章向大家展示8個(gè)驚艷的 HTML5 和 JavaScript 。作為下一代網(wǎng)頁(yè)語(yǔ)言，HTML5 擁有很多讓人期待已久的新特性，越來(lái)越多的開(kāi)發(fā)人員開(kāi)始使用 HTML5 來(lái)制作各種交互性強(qiáng)、效果豐富的 Web 應(yīng)用。下面這些驚艷的示例帶您體驗(yàn) Web 技術(shù)的魅力，相信你看完這些例子后會(huì)對(duì)未來(lái)的 Web 發(fā)展充滿(mǎn)無(wú)限期待。為了有更好的效果，建議在 Chrome 瀏覽器中瀏覽。
這個(gè)示例叫瘋狂的觸手，移動(dòng)鼠標(biāo)可以進(jìn)行涂鴉，點(diǎn)擊鼠標(biāo)可以清除畫(huà)布。
使用HTML5 Canvas實(shí)現(xiàn)的文本特性，制作教程可參考：Typographic effects in canvas
WebGL Globe 是一個(gè)開(kāi)放的地理數(shù)據(jù)可視化平臺(tái)，我們鼓勵(lì)你復(fù)制代碼，添加自己的數(shù)據(jù)，創(chuàng)建自己的應(yīng)用。
吸引眼球的粒子系統(tǒng)，旨在測(cè)試WebGL的性能，滑動(dòng)鼠標(biāo)能產(chǎn)生絢麗的效果（safari中瀏覽會(huì)導(dǎo)致藍(lán)屏！）。
用鼠標(biāo)和粒子進(jìn)行交互，大膽一些，就能發(fā)現(xiàn)你第一眼發(fā)看不到的精彩。
使用 WebGL 實(shí)現(xiàn)的特隆坦克，靈感來(lái)源于迪斯尼1981電影《Tron》。
照片粒子實(shí)驗(yàn)，如果你想知道把一張照片分解成一個(gè)個(gè)粒子，并有紅、綠、藍(lán)三個(gè)中心會(huì)是什么樣的，試試這個(gè)實(shí)驗(yàn)吧。
使用WebGL實(shí)現(xiàn)的水面實(shí)驗(yàn)，可放入一張照片，使用鼠標(biāo)觸動(dòng)水面會(huì)有奇果。藍(lán)藍(lán)設(shè)計(jì)的小編 http://www.gerard.com.cn