前言
HTML5一個相當出色的web技術，它不僅可以讓你更加方便地操縱頁面元素，而且可以通過canvas實現更多的動畫特效，引進HTML5標準後，CSS3也就可以發揮更大的作用。本文主要介紹了一些基於HTML5 Canvas的動畫特效，分享給大家，希望大家喜歡。
其實做爲一個前端開發者，有一個學習的氛圍跟一個交流圈子特別重要，這是一個我的前端交流羣：330336289，邀請編號：寂靜。不管你是小白還是大牛歡迎入駐，大家一起交流學習，繼續學習，特效源碼也會在羣裏分享
1、HTML5 Canvas畫板畫圖工具 可定義筆刷和畫布
HTML5 Canvas還有一個比較實用的應用，那就是網絡畫板，這樣我們就可以在網頁上直接進行畫圖操作。今天要分享的這款HTML5 Canvas畫圖工具就可以簡單實現網絡畫圖的功能，我們可以自定義筆刷的類型、粗細、顏色，也可以定義畫布的大小和背景顏色等。我們也可以對這款HTML5畫圖工具進行擴展，讓它的畫圖功能更加完善。·
2、HTML5/CSS3帶日期區間的日期選擇插件
一款實用的HTML5/CSS3日期選擇插件，這款日期選擇插件的外觀還是挺清新簡易的，但是整體來說還是挺漂亮的。另外，該日期選擇插件還有一個最大的特點，那就是可以自定義日期的區間，我們可以快速的制定區間範圍內的日期，非常方便。·
3、HTML5小車動畫 很酷的HTML5吉普車
很多HTML5動畫都是利用CSS3的一些特性和Canvas特性來完成，比如HTML5/CSS3實現蝙蝠俠人物動畫就利用CSS3的動畫特性，HTML5 Canvas模擬衣服撕扯動畫就利用了HTML5 Canvas特性。今天我們要分享一款利用HTML5/CSS3實現的吉普車動畫，小車可以水平滾動，非常逼真。·
4、HTML5/CSS3滑塊動畫菜單 圖標動畫很酷
CSS3菜單有3D菜單、下拉菜單、Tab菜單等，具體大家可以移步至CSS3菜單欄目下查找。今天我們要分享的這款HTML5/CSS3滑塊動畫菜單非常酷，鼠標滑過菜單項時會有一個漂亮的遮罩移動過來，並且這款動畫菜單還有非常酷的圖標，菜單整體效果很大氣。·
5、HTML5/CSS3 3D文字特效 文字外翻效果
一款很酷的HTML5/CSS3 3D文字特效，該文字特效的效果是鼠標滑過文字就會出現3D外翻的效果，非常不錯的一款文字特效。
6、CSS3波浪形菜單 結合背景超級絢麗
這款CSS3菜單有點特別，菜單的整體形狀類似波浪形，鼠標滑過菜單項時也會改變背景色表示該菜單項被激活。另外該CSS3菜單結合不錯的背景圖片效果更加震撼。
7、HTML5/CSS3時尚的圓盤時鐘動畫 帶當前日期
我們可以利用HTML5和CSS3來實現一些鐘錶動畫特效，效果都還不錯。一款利用HTML5和CSS3的圓盤時鐘動畫，時鐘外觀非常時尚。更重要的功能是，該HTML5時鐘動畫還帶有當前的日期，這是很多時鐘所沒有的功能。
·
8、CSS3漂亮的自定義checkbox複選框 9款迷人樣式
CSS3自定義checkbox複選框純CSS3美化Checkbox和Radiobox按鈕，外觀非常時尚。下面是9款樣式迷人的CSS3漂亮的自定義Checkbox複選框。這幾款複選框樣式很豐富，使用起來也比較方便。·
9、HTML5/CSS3發光搜索表單 超酷CSS3表單
純CSS3實現的發光登錄表單，發光特效非常不錯。下圖是一款CSS3發光搜索表單，表單整體是黑色的風格，搜索框被激活時，輸入框就會發光，由於黑色的背景，整個搜索表單就顯得格外絢麗光亮。·
10、HTML5自定義Checkbox和Radiobox 很酷的選中動畫
瀏覽器自帶的Checkbox和Radiobox的樣式不僅外觀醜陋，而且控制起來也不方便，特別是Checkbox在各個瀏覽器中的樣式都不同，今天我們來利用HTML5和CSS3技術來自定義Checkbox和Radiobox的樣式，特別是Checkbox，在選中的時候還有非常酷的選中動畫。·
11、HTML5/CSS3自定義抖動表單 下拉表單很時尚
像這款HTML5/CSS3聯繫表單非常立體，純CSS3發光登錄表單非常炫酷。今天我們要分享一款非常不錯的自定義抖動表單，有輸入框、下拉框、複選框和按鈕，這些表單元素都是通過CSS3渲染的，外觀非常不錯。初始化的時候這些表單元素還會有抖動動畫。·
12、CSS3仿百度圖片瀏覽效果
13、HTML5愛心跳動動畫 用技術勾引妹子
在網站上，我們分享過一些浪漫程序員表白的HTML5動畫，像這款浪漫程序員 HTML5愛心表白動畫，相信不少女生看了都會心動。今天我們要分享一款利用HTML5的愛心跳動動畫，相對前一款，它要簡單一些，如果妹子打開Email看到跳動的愛心，估計也能在心裏甜甜的一笑。·
14、HTML5紙帶翻轉動畫 超炫的3D特效
HTML5動畫雖然不是基於canvas的，它是基於jade和scss的，這款紙帶翻轉動畫非常不錯，翻轉時的3D特效也非常讓人驚歎，比較消耗CPU。
15、純CSS3垂直動畫菜單 效果很酷
今天我們來分享一款CSS3垂直菜單，這款垂直菜單不僅有漂亮的小圖標，而且鼠標滑過時還有非常酷的CSS3動畫，大家可以試試這款CSS3垂直菜單。··
16、HTML5像素文字爆炸重組動畫特效
HTML5可以把文字效果做得非常酷，就像之前分享的HTML5/CSS3發光文字和HTML5/CSS3文字投影特效就非常絢麗。今天我們要分享一款基於HTML5技術的文字像素爆炸重組動畫特效，我們可以在輸入框中指定任意文字，點擊確定按鈕後，就會將原先的文字爆炸散去，新的文字以像素點的形式組合起來，看起來非常棒。·
請把這篇文章分享給正在學習前端的朋友，希望該篇文章可以幫到一些小夥伴學到新的技巧。
最後祝所有程序員都能夠走上人生巔峯，讓代碼將夢想照進現實，有不懂的問題可以隨時問我，工作不忙的時候希望可以給大家解惑。