16個超牛逼的HTML5和JavaScript特效

不用說, Flash的效果大家都清楚。實際上,HTML5和Java擁有很多新屬性,可以用它們來替代Flash。W3Cschool精選16個超牛逼的HTML5和Java特效,看了這些特效,未來的Web發展前途無量。
圖片描述
1.特效:FlowerPower

創作者使用花朵作爲畫刷,以貝茲曲線方式繪圖。
圖片描述
2.特效:Breathing Galaxies

動態變換直徑及顏色,可通過鼠標或鍵盤產生新形狀,這個效果不錯!
圖片描述
3.特效:Noise Field

移動鼠標可改變粒子運動,點擊可隨機生成不同粒子效果。
圖片描述
4.特效:HTML5 Canvas粒子效果文字動畫特效

W3Cschool利用HTML5,製造出了粒子效果文字動畫特效。只要你輸入框中輸入想要展示的文字,回車後即可在canvas上繪製出粒子效果的文字動畫,相當酷的動畫效果。
圖片描述
5.特效:Swirling Tentacles

三維脈衝效果,沿着脈衝線有運動的顏色漸變模塊。
圖片描述
6.特效:Keylight

雙擊生成兩個以後的鍵即可發出聲音,移動鍵的位置可產生不同的聲音效果。W3Cschool上面有很多這樣的教程,有興趣可以去看一下!
圖片描述
7.特效:Rotating Spiral

旋轉的螺旋效果,單擊可以控制開始和停止旋轉,是不是覺得高大上?
圖片描述

8.Blob

拖動水滴有重力效果,雙擊可以分離,小水滴碰到大水滴會合並。

圖片描述

9.Trail

彩色顆粒跟隨鼠標運動效果,帶尾巴淡出效果。
圖片描述

10.Graph Layout

一種交互的力向圖佈局效果,刷新三觀。

圖片描述

11.Typographic Effects

使用HTML5 Canvas實現的文本特性,效果超過Flash。
圖片描述

12.Crazy Tentacles

移動鼠標可以進行塗鴉,點擊鼠標可以清除畫布,看着確實瘋狂。
圖片描述

13.Nebula

吸引眼球的粒子系統,目的是測試WebGL性能,如果滑動鼠標,可以產生絢麗效果。
圖片描述

14.WebGL Globe

WebGL Globe 是一個開放的地理數據可視化平臺,我們鼓勵你複製代碼,添加自己的數據,創建自己的應用。
圖片描述

15.Particle Playground

用鼠標和粒子進行交互,能發現不一樣的精彩。
圖片描述

16.Surface

使用WebGL實現的水面特效實驗,可放入一張照片,使用鼠標觸動水面會有奇特效果。

上面的HTML5和Java特效,簡直趕超Flash。W3Cschool上面有很多用戶留言稱HTML5和Javait將替代Flash,不過對於這種說法,也不知道怎麼去評判。畢竟這些用戶說的也是很有道理,你認爲Javait會替代Flash嗎?很想知道你的答案!

學習前端的同學注意了!!!
學習過程中遇到什麼問題或者想獲取學習資源的話,歡迎加入前端學習交流羣,羣號碼:328058344

發佈了39 篇原創文章 · 獲贊 4 · 訪問量 1萬+
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章