7 個讓人驚嘆的 HTML5 鼠標動畫

今天我們一起來分享一些有趣的HTML5鼠標動畫，當我們移動鼠標時，頁面上將會出現一些神奇的動畫特效。當然這些動畫可能在實際應用中并不太會使 用到，但是對大家研究HTML5和CSS3的幫助應該會非常大。本文分享的7個HTML5鼠標動畫都提供源代碼下載，都是一些不錯的資源。

1、HTML5鯨魚動畫

今天我找到了基于HTML5的鯨魚動畫，鯨魚會隨著鼠標的移動而游動，畫面非常立體，鯨魚也超級逼真。真的，HTML5確實很給力，HTML5動畫完全可以完成flash能做的事情。

在線演示        源碼下載

2、JavaScript鼠標跟隨星星飄落動畫

今天我們要來分享一款有趣的JavaScript動畫，這種鼠標跟隨動畫應該也是很早就有的東西，特別是應用在一些個性化的個人博客中。這款JavaScript鼠標跟隨動畫是一些飄落的星星，星星的形狀和顏色也是隨機變化的，非常可愛。

在線演示        源碼下載

3、HTML5夢幻特效 可給任意元素添加魔幻效果

我們來換一種風格，來分享一款看起來比較魔幻的HTML5特效。它可以給網頁上任意元素（圖片、文字等）添加這么一種效果，即鼠標滑過時，元素上就會出現非常魔幻的動畫特效，什么特效呢？你可以點開demo鏈接查看。

在線演示        源碼下載

4、HTML5 Canvas煙花動畫 可控制煙花速度和大小

這個HTML5煙花動畫是基于canvas的，可以說是之前分享那款的升級版，它可以控制煙花上升的速度和煙花綻放花朵的大小。由于是在HTML5 Canvas畫布上完成，因此也就非常靈活。

在線演示        源碼下載

5、HTML5火球擋板碰撞動畫游戲

今天我們要再來分享一款超酷的HTML5火球擋板碰撞動畫游戲。屏幕上有一個火球在不停的運動，你可以移動鼠標滑動屏幕下方的擋板，火球碰撞到擋板后，即可反彈出去，這是個很有特色的HTML5游戲。

在線演示        源碼下載

6、HTML5實現圖形擠壓變形動畫

今天我們要來分享一款很特別的HTML5動畫特效，它是一款圖形擠壓動畫。鼠標移動小球，該小球會和周圍的幾個小球產生擠壓效果，從而使受擠壓的小球產生相應的變形，利用HTML5是這個擠壓變形的特效顯得非常逼真，一起來玩玩吧。

在線演示        源碼下載

7、HTML5 Canvas火焰閃爍動畫 火焰跟隨鼠標

今天我們來分享一款HTML5火焰閃爍動畫，也是基于Canvas的，火焰上下竄動的效果非常逼真，并且，火焰可以跟隨鼠標移動，是一款非常炫的HTML5 Canvas動畫。

在線演示        源碼下載

看完以上這7個HTML5鼠標動畫，是不是覺得HTML5非常強大？的確，很多動畫我們都基于HTML5 Canvas來創建，所以我們需要對Canvas畫布有一定的認知和了解，希望這些HTML5動畫能給大家帶來幫助。