推薦幾款製作網頁滾動動畫的 JavaScript 庫

它們中，有的可以幫助你在頁面滾動的時候新增動感的元素動畫，有的則是實現目前非常流行的全屏頁面切換動畫。相信藉助這些外掛，你也可以讓網站變得高大上起來。

ScrollReveal.js
ScrollReveal.js 用於建立和管理元素進入可視區域時的動畫效果，幫助你的網站增加吸引力。只需要給元素增加 data-scrollreveal 屬性，當元素進入可視區域的時候會自動被觸發設定好的動畫。
 

 

線上演示     立即下載

 
ScrollMagic
ScrollMagic 是一款 jQuery 外掛，它讓你可以像使用進度條一樣使用滾動條。如果你想在特定的滾動位置開始一個動畫，並且讓動畫同步滾動條的動作，或者把元素粘在一個特定的滾動位置，那麼這款外掛正是你需要的。
 

 

線上演示      立即下載

 
pagePiling.js
全屏滾動效果是最近非常流行的網頁設計形式，帶給使用者良好的視覺和互動體驗。pagePiling.js 這款 jQuery 外掛可以幫助前端開發人員輕鬆實現這種效果。支援所有的主流瀏覽器，包括IE8+，支援移動裝置。
 

 

效果演示     外掛下載

 
WOW.js
在一些網頁上，當你滾動頁面的時候會看到各式各樣的元素動畫效果，非常動感。WOW.js 就是一款幫助你實現這種 CSS 動畫效果的外掛，很容易定製，你可以改變動畫設定喜歡的風格、延遲、長度、偏移和迭代等。
 

 

立即下載      效果演示

 
ScrollMe
ScrollMe 是一款 jQuery 外掛，用於給網頁新增簡單的滾動效果。當你向下滾動頁面的時候，ScrollMe 可以縮放，旋轉和平移頁面上的元素。它易於設定，不需要任何自定義的 JavaScript 程式碼支援。
 

 

線上演示      原始碼下載   

 
Parallax.js
Parallax.js 是一個簡單的，輕量級的的視差引擎，能夠對智慧裝置的方向作出反應。在沒有沒有陀螺儀或運動檢測硬體可用的時候，使用游標的位置來代替。有很多的行為，你就可以設定為任何給定的視差例項。這些行為既可以通過在標記中指定的資料屬性或通過建構函式 和 JavaScript API 呼叫。
 

 

效果演示      外掛下載