值得看看，2019 年 11 個受歡迎的 JavaScript 動畫庫！

阿里雲最近在作活動，低至2折，有興趣能夠看看：
https://promotion.aliyun.com/...

---

爲了保證的可讀性，本文采用意譯而非直譯。

想閱讀更多優質文章請猛戳GitHub博客,一年百來篇優質文章等着你！

1.Three.js

超過46K的星星，這個流行的庫提供了很是多的3D顯示功能，以一種直觀的方式使用 WebGL。這個庫提供了<canvas>、 <svg>、CSS3D 和 WebGL渲染器，讓咱們在設備和瀏覽器之間建立豐富的交互體驗。該庫於2010年4月首次推出，目前仍有近1000名貢獻者在開發中。

2. Anime.js

超過20K的星星，Anime是一個JavaScript動畫庫，能夠處理CSS屬性，單個CSS轉換，SVG或任何DOM屬性以及JavaScript對象。 此庫容許您連接多個動畫屬性，將多個實例同步，建立時間軸等。

3.Mo.js

超過 14K 星星，是一個用於 Web 的動態圖形工具帶，具備簡單的聲明 API，跨設備兼容性和超過1500個單元測試。 您能夠在DOME或SVG DOME周圍移動東西或建立惟一的 mo.js 對象。雖然文檔有些稀缺，可是示例很豐富，這裏有CSS技巧的介紹。

4. Velocity

超過 15k 星星,Velocity是一個快速的 Javascript 動畫引擎，擁有與jQuery的 $.animate() 相同的API。它具備彩色動畫、轉換、循環、畫架、SVG支持和滾動。這裏是Velocity的高性能引擎的分解，這裏是使用該庫的 SVG 動畫的介紹。

5. Popmotion

超過 14K 星星，這個動畫庫大小隻有 11 kb。它容許開發人員從動做建立動畫和交互，這些動做是能夠啓動和中止，可使用CSS、SVG、React、three建立，js和任何接受數字做爲輸入的API。

6. Vivus

超過 10k 星星，Vivus是一個零依賴的JavaScript類，可讓你爲SVG製做動畫，讓它們具備被繪製的外觀。 您可使用許多可用動畫之一，或建立自定義腳原本繪製SVG。 查看Vivus-instant獲取實際示例，親自動動手練習一下。

7. GreenSock JS

GSAP 是一個JavaScript庫，用於建立高性能、零依賴、跨瀏覽器動畫，據稱在超過400萬個網站上使用。GSAP是靈活的，能夠與React、Vue、Angular和vanilla JS協同工做。GSDevtools 還能夠幫助使用GSAP構建dubug動畫。

8. Scroll Reveal

擁有15K顆星星和零依賴，這個庫爲 web 和移動瀏覽器提供了簡單的滾動動畫，以動畫的方式顯示滾動中的內容。它支持多種簡潔的效果類型，甚至容許你使用天然語言定義動畫。這裏有一個簡短的 SitePoint教程。

9. Hover (CSS)

超過 20k 星星，Hover提供了CSS3支持的懸停效果集合，可應用於連接、按鈕、徽標、SVG、特點圖像等，在CSS、Sass和LESS中可用。您=能夠複製和粘貼但願在本身的樣式表中使用的效果，或者引用樣式。

10. Kute.js

一個徹底成熟的原生JavaScript動畫引擎，具備跨瀏覽器動畫的基本功能。 重點是代碼質量，靈活性，性能和大小（核心引擎17k 和 gzipped 5.5k） - 這是一個演示。 該庫也是可擴展的，所以你能夠添加本身的功能。

11. Typed.js

超過 7k 星星，這個庫基容許你以選定的速度爲字符串建立打字動畫。 你還能夠在頁面上放置 HTML div 並從中讀取以容許搜索引擎和禁用JavaScript的用戶訪問，由Slack和其餘人使用，這個庫既流行又很是有用。

你的點贊是我持續分享好東西的動力，歡迎點贊！

一個笨笨的碼農，個人世界只能終身學習！

更多內容請關注公衆號《大遷世界》！

編輯中可能存在的bug無法實時知道，過後爲了解決這些bug,花了大量的時間進行log 調試，這邊順便給你們推薦一個好用的BUG監控工具 Fundebug。

交流

乾貨系列文章彙總以下，以爲不錯點個Star，歡迎 加羣 互相學習。

https://github.com/qq44924588...

我是小智，公衆號「大遷世界」做者，對前端技術保持學習愛好者。我會常常分享本身所學所看的乾貨，在進階的路上，共勉！

關注公衆號，後臺回覆福利，便可看到福利，你懂的。