1、HTML5 SVG 樹枝分叉動畫特效
今天我們來分享一款基於HTML5和SVG的動畫效果，它是一個可以自動分叉的樹，動畫將以二叉樹的形式展開。這三顆SVG樹先是用svg的g畫筆來定義這些樹枝，然後利用javascript來實現動態改變g從而實現樹枝的分叉展開動畫。
2、HTML5/CSS3 3D下拉摺疊選單 超炫CSS3選單動畫
之前我們介紹過很多CSS3選單了，效果都十分華麗炫酷，但是這些CSS3選單基本都是二維平面選單，今天要分享的這款HTML5/CSS3選單卻是3D的效果。選單展現時出現摺疊下拉的動畫特效，選單也可以收起，滑鼠滑過選單項的效果也很不錯。
3、HTML5/CSS3扇形進度條動畫 可漸變顏色
今天我們要來分享一款很特別的CSS3進度條動畫，它是一個半個圓的扇形，同時，隨著進度的增加，進度條的背景顏色會逐漸變化，最後完成的時候變成綠色，效果非常不錯。另外，我們再推薦之前分享過的一款進度條：漂亮的CSS3動畫進度條 可自定義進度條顏色。
4、HTML5 Canvas煙花特效 場景十分華麗
對於HTML5技術來說，Canvas應用非常廣泛，基本上所有HTML5動畫特效都會用到Canvas特性。今天我們要分享一款基於HTML5Canvas實現的煙花特效，我們只需在黑色的畫布上點選滑鼠，即會有漂亮的煙花綻放在夜空當中。
5、CSS3 Loading載入動畫 小球迴圈轉圈
今天我們要來看一款非常動感的CSS3Loading載入動畫特效，它和其他的Loading動畫不一樣，它並沒有十分規則的圓圈動畫，而是不規則的轉圈，有5個小球互相撞擊轉圈來實現這款Loading動畫特效。另外我們還可以看一款HTML5 Canvas實現超酷Loading動畫，也非常不錯。
6、jQuery模擬鍵盤事件 可對應鍵盤每一個鍵
這是一款基於jQuery的模擬鍵盤事件的應用，鍵盤上除了功能鍵，其他鍵都可以用這款外掛來模擬。當你敲擊鍵盤上的鍵時，這款應用會幫助你獲取到這個鍵的事件，並在頁面上的模擬鍵盤中以動畫的形式展現出來，相當實用。
7、HTML53D彈簧線圈動畫特效
這是一款基於HTML5的3D動畫特效，它是一個線圈彈簧，並且可以像波浪一樣運動，就像真實的彈簧一樣，每一圈的彈簧都會跟隨上一圈的運動而運動，非常逼真。之前我們也分享過一款CSS3彈簧線圈動畫，效果也很不錯。
8、CSS3 3D 蘋果筆記本動畫
這又是一款超酷的CSS3 3D動畫效果，它是一款帶有3D視覺效果，並且可以360度旋轉的macbook air。這款CSS33D動畫的筆記本底部有一個逼真的投影，可以跟隨圖片一起轉動，從而凸顯其3D效果，是一款很不錯的CSS3 3D動畫特效。
9、CSS3 3D立方體動畫 表面顏色可漸變
這是一款很酷的CSS33D立方體動畫，和之前分享的立方體動畫不同的是，這款CSS3立方體動畫的幾個表面的背景顏色都有漸變的動畫效果，伴隨著立方體的旋轉，這款CSS33D動畫顯得更加炫酷迷人，效果非常不錯。
10、jQuery/CSS3相簿瀏覽外掛 相簿圖片濾鏡效果
這是一款基於jQuery和CSS3的超酷相簿瀏覽外掛，當我們滑過相簿圖片的縮圖時，圖片即會產生濾鏡效果，由灰色程式設計彩色，同時圖片周圍產生不錯的陰影效果。點選縮圖時，我們將開始瀏覽相簿的原始圖片，我們點選右上角的關閉按鈕即可回到相簿縮圖模式。
以上就是10款很酷的HTML5動畫和實用應用及原始碼下載，歡迎收藏分享。
本文轉載自：http://www.html5tricks.com/10-html5-animation-app-code.html