版友們大家好！
這次我整理了一些 SVG 動畫的作法及原理：
http://mzl.la/4-svg-anim-examples
文中有四個 codepen 範例，
完整的應用也可以參考文內附的 github 原始碼連結。
會開始使用 SVG 動畫一開始是在 GardenStudio 網站上看到描邊動畫，
http://gardenestudio.com.br/
發現是用 SVG 做的，於是開始研究各種 SVG 動畫的用法。
基本上 SVG 在網頁上使用起來不會太難，
而且能做到跟 Flash 類似的動畫效果（形狀漸變、導引線動畫等），
也不怕縮放後會有鋸齒顆粒。
可惜的是 IE9 以上才開始有靜態 SVG 的支援，
且目前為止仍不支援 SVG SMIL Animation。
想要在 IE9 以上運作 SVG 動畫，
只能透過 Javascript 來操作物件的屬性，
或者透過額外的 Javascript 套件如 Snap.svg 等。
要使用何種作法、或是否採用 SVG，
就要看網頁在哪些瀏覽器呈現最佳的效果囉！