讓你大開眼界的9款HTML5動畫特效
前幾篇文章中我們已經分享了許多令人驚嘆的 HTML5 3D 特效和 HTML5 Canvas 特效，確實非常不錯，今天我們精選了 9 款讓你大開眼界的 HTML5 動畫特效，一起來看看。
1、HTML5 夢幻特效可給任意元素添加魔幻效果
我們之前介紹 HTML5 動畫特效比較多的是 HTML5 3D 特效，今天我們來換一種風格，來分享一款看起來比較魔幻的 HTML5 特效。它可以給網頁上任意元素（圖片、文字等）添加這么一種效果，即鼠標滑過時，元素上就會出現非常魔幻的動畫特效，什么特效呢？你可以點開 demo 鏈接查看。
2、HTML5/SVG 實現過山車動畫
今天我們要分享一款很酷的 HTML5/SVG 動畫，這款 HTML5 動畫是過山車效果，主要是利用了 SVG 的 path 動畫來實現的，效果非常酷。
3、HTML5 像素粉碎圖片動畫圖片灑落一地
這款 HTML5 圖片動畫特效你絕對想不到，它將一張圖片粉碎成許多像素顆粒，點擊圖片后，這些像素顆粒邊掉落在地上，繼續點擊，粉碎的像素圖片顆粒又會重新組合成完整的 圖片。用 HTML5 技術實現這種圖片粉碎效果還是挺簡單的，有興趣的同學可以下載源碼來學習。
4、HTML5 Canvas 繪制灰太狼超級可愛
HTML5 Canvas 相當于一個畫板，你可以在 Canvas 繪制任意的東西，今天要分享一款利用 HTML5 Canvas 繪制的灰太狼形象，個人以為，這個灰太狼繪制得十分逼真形象，小伙伴們都要驚呆了。以后我們再來弄一個 HTML5 Canvas 的喜洋洋如何？
5、用 HTML5/CSS3 給女朋友送個生日蛋糕
現在有了 HTML5，我們在瀏覽器上制作動畫已經不是什么難事了，但是一個好的創意卻很難，比如說用技術來博得女孩子的喜歡。今天我們分享的這款生日蛋糕動畫非常 有創意，它是用 svg 來做的，利用 HTML5 的 api 讓制作蛋糕的過程展示出來，這個蛋糕在妹子生日的時候送給她一定會讓她覺得很驚奇。祝你成功哦！
6、HTML5 SVG 狐貍奔跑動畫相當大氣
今天我要來向大家分享一款超級酷的 HTML5 動畫，它是一只快速奔跑的狐貍，奔跑的動作非常自然逼真，長長的狐貍尾巴也會隨著擺動。另外，這款 HTML5 狐貍奔跑動畫也是基于 SVG 的，前面我們也介紹過很多哦 SVG 的動畫效果，可見 SVG 在動畫制作上也有很大的優勢。
7、很有個性的 CSS3 彈跳 Loading 動畫
今天我們要來分享一款非常具有創意的 CSS3 Loading 動畫，這款 CSS3 Loading 動畫是一個跳動的小球和幾個滾動的小球組合而成，效果非常不錯。
8、HTML5/CSS3 奔跑動畫動畫效果非常逼真
今天要分享一款很酷的模擬真人奔跑動畫，它主要是利用 HTML5/CSS3 技術結合多張圖片的切換來實現的。這款 HTML5 動畫的逼真之處在于人物在奔跑的時候很有節奏感，而且有人物的投影。更重要的是當人物跑的越來越近是，人物的大小也會隨之變大。很像一個小男孩從遠處跑過 來。
9、一套 HTML5/SVG 表情圖標表情超可愛
這次我們要來向大家分享一款超級可愛的 HTML5/SVG 表情圖標，一共有 12 組不同的表情，這些表情都是利用 SVG Path 繪制而成，對 SVG 熟悉的朋友應該覺得比較簡單，但是這些表情的創意確實非常不錯，你可以將這些 svg 表情應用到你的博客上去，非常可愛。
以上就是 9 款優質的 HTML5 動畫特效，大開眼界了吧，歡迎收藏分享。