9款賞心悅目的HTML5/CSS3應用特效（免積分下載咯）

免積分：http://download.csdn.net/detail/yangwei19680827/7010727

經過幾天的收集，在html5tricks網站上又增加了不少HTML5的教程和應用，今天我把幾款賞心悅目的HTML5/CSS3應用特效總結了一下，一共9款HTML5特效，分享給大家。

1、HTML5 WebGL實驗 超酷的HTML5 Canvas波浪牆

在HTML5特效中，和水波相關的我們已經分享過兩款：HTML5 WebGL水面水波蕩漾特效、HTML5水波蕩漾動畫特效。這又是一款HTML5 Canvas實驗項目，也是波浪特效，只是這不是真正的水波，而是利用柱體高度的變化實現的波浪牆效果。

線上示範    /    源碼下載

2、HTML5重力感應動畫特效 衝撞小球示範

前面我已經向大家分享過一款非常絢的HTML5重力感應遊戲特效，我們只需要用滑鼠甩動頁面上的元素就可以實現類比重力感應的效果。今天這款HML5重力感應動畫特效功能更強，頁面上會掉落大小不等的小球，我們可以拖動小球，也可以點擊頁面空白來生產更多的小球，如果你的電腦配置高，可以試試產生更多的小球來玩，非常有趣。

線上示範    /    源碼下載

3、HTML5 Canvas圖表應用RGraph 圖表功能非常強大

前幾天我向大家分享過一款HTML5即時資料圖表，可以選擇資料展示的時間段。今天再分享一款功能強大的HTML5 Canvas圖表應用，這款HTML5圖表有多種類型，直線圖，柱狀圖，餅狀圖，甚至還有混合圖，圖表配置也十分簡單，功能卻非常強大。

線上示範    /    源碼下載

4、新款CSS3按鈕組合 5組可愛CSS3按鈕

之前我分享過一些時尚的CSS3動畫按鈕，比如CSS3渲染Checkbox實現3D開關切換按鈕、純CSS3 3D按鈕 按鈕酷似牛奶般剔透等等。今天就再來分享一款可愛的CSS3按鈕組合，該CSS3按鈕一共有5種不同的風格，有幾款還有3D立體的效果。一起來欣賞這些可愛的CSS3按鈕吧。

線上示範    /    源碼下載

5、CSS3圖片層疊展開特效 可展開扇形效果

今天要分享的這款CSS3圖片特效沒有那麼絢麗，它的功能非常簡單，當你把滑鼠移到圖片上時，多張圖片便會由原先的疊在一起變成展開狀態，展開過程中伴隨CSS3動畫，展開的形狀是扇形。這款簡單的CSS3圖片層疊展開動畫可以應用在圖片展示和圖片分享上。

線上示範    /    源碼下載

6、HTML5 Canvas餅狀圖表 HTML5&jQuery圖表應用

以前我們利用jQuery製作過一些圖表應用，使用起來都非常方便。今天再來看一款基於HTML5 Canvas的餅狀圖圖表應用，滑鼠點擊餅狀圖的某塊地區時，即可高亮反白該地區。由於該餅狀圖是基於HTML5開發的，所以需要支援HTML5的瀏覽器才能夠使用。

線上示範    /    源碼下載

7、CSS3 Loading進度條載入動畫特效 3款絢麗風格

前面我向大家分享了幾款非常漂亮的CSS3進度條外掛程式，CSS3 SVG 進度條 Loading 動畫、純CSS3進度條 華麗5色進度條樣本。今天我要分享一款更加炫酷的CSS3進度條載入動畫特效，該動畫特效有3個不同的風格，注意，IE6，7，8是不支援該進度條動畫的。

線上示範    /    源碼下載

8、純CSS3進度條 華麗5色進度條樣本

這是一款利用純CSS3實現的進度條，它的實現非常簡單，沒有複雜的動畫，該CSS3進度條最大的特點是擁有非常漂亮的5種顏色，整個進度條看上去非常專業。這款CSS3進度條和之前的CSS3 3D進度條相比顯得更簡單易用。

線上示範    /    源碼下載

9、CSS3聯絡表單 清新外觀帶美化Select表單

之前我向大家分享過一款非常絢麗的CSS3發光表單，的確是很酷，大家可以先看看。今天要分享的這款CSS3表單就比較清新簡單了。表單整體看上去很乾淨，特別的是，該CSS3聯絡表單有一個自訂的美化select表單，表單項在被啟用的時候邊框顏色會改變。

線上示範    /    源碼下載

以上就是9款賞心悅目的HTML5/CSS3應用特效，歡迎收藏和分享。

原文連結 ：http://www.html5tricks.com/9-html5-css3-cool-effect.html