現在市面上有一大批H5頁面模板製作工具，誠然，他們方便了很多非專業設計師設計製作H5頁面。但是，很多模板工具上的作品大部分還停留在左飛入右飛出的初級境界，看多了真心有些膩，動效如無美感還不如看靜態的。
那H5裏有哪些高級動效了？小思仔細體驗了國內所有優秀H5頁面作品，整理出下面幾個H5頁面特效。我們的H5作品如果能用上其中一兩個，相信能增色不少！
1、粒子特效
—》》一鍵爆炸
模擬現實中的水、火、霧、氣等效果由各種三維軟件開發的製作模塊，原理是將無數的單個粒子組合使其呈現出固定形態，藉由控制器，腳本來控制其整體或單個的運動，模擬出現真實的效果。作者沒有使用 canvas ，所以無法取到圖片上每個像素的顏色值。便使用了一些比較討（sha）巧（bi）的方法。構造新圖容器，隱藏原圖—>生成一張張是碎裂小圖—>boom 爆炸！
鏈接：http://web.jobbole.com/85543/
2.SVG路徑動畫
—》》水滴效果
普通的dom元素，製作圓滑曲線基本是不可能的，根據以往的積累，我們是可以通過svg中的<path>來描繪貝塞爾曲線，達到實現圓滑曲線的效果。所以，採用svg來製作整個類水滴的索引組件是很好的解決辦法。
鏈接：http://ued.baidu.com/?p=4959
3、序列幀動畫
作品解析：
逐幀動畫類似與電影的播放模式，很適合於表演細膩的動畫。例如：頭髮及衣服的飄動、走路等等。序列幀動畫是隻在時間軸的每幀上逐幀繪製不同的內容，使其連續播放而成動畫。
鏈接：http://www.epub360.com/search?q=一個字
4.Cinemagraphic
Cinemagraphic是一項將神奇的局部運動賦予靜態照片的新技術。該應用恰到好處地了詮釋了“自然風”的概念，作爲互動者的人們，當看到畫面上被風拂過的Cinemagraphic動態場景，他們也身臨其境地感受到自然風所能帶來的這種清爽感受。
鏈接：http://cool.levi.com.cn
5.全景
—》》杜蕾斯的第一座美術館
杜蕾斯“美術館”的創新，在於它其實是熱門廣告形式H5頁面的僞裝。“我們想要通過多重手段（比如館內的彩蛋、12 點閉館無法訪問等等）來創造一個虛擬的真實空間，而不是傳統H5的單線程教育的邏輯。” Socialab 杜蕾斯組的負責人說，“液體主義羣展將是杜蕾斯美術館無數展覽中的第一個。”
6.3D
夜空繁星中題字燈籠飛來飛去的3D炫目效果，祝福燈籠還可以360旋轉呈現，“最飛羊的新春祝願”的主題表現的淋漓精緻。
鏈接：http://old.vmlim20.com.cn/demo/2015cny/
7.點擊碎屏
“擊屏幕”畫面好像很討人喜歡，大概有三輪左右的“擊碎”動作，這是整個H5的互動高峯。另外手機來電也應用到了很多H5的功能上。
鏈接：http://evt.dianping.com/8809/index.html
8.長按逐字
這個頁面用打字機的形式呈現，觸發逐字等動效很真實，用戶按下按鈕後，紙片會逐漸顯示出韓寒從1999年起的成長軌跡。
鏈接：http://wx.oneplus.cn/mrx/
