10個關於視差滾動效果的教程和外掛

　　近些年來，使用者對視覺體驗的要求不斷提高，而設計師們也開始在網頁設計中加入各種特效元素以滿足使用者的需求。其中有一種特效的效果很具有吸引力，它就是視差滾動效果。視差滾動（Parallax Scrolling）是指讓多層背景以不同的速度移動，形成立體的運動效果，可以帶來非常出色的視覺體驗。

　　隨著這種炫酷的效果首次在Nike 2011年的 Nike Better World 專案中完美展現，如今這種視差滾動效果被越來越多的國外網站所應用，成為Web設計的熱點趨勢。因此，本文整理了十種關於此效果的教程和外掛和大家分享，希望為你的網站設計提供一些靈感。

　　不過有兩個方面需要讀者注意：

1. 以大量圖片為特色的網站應該考慮影象的預載入問題，以便為使用者提供更好更流暢的視覺體驗；
2. 某些網站頁面在移動裝置上的效果可能較之在PC上有所不同，一些功能也可能無法正常使用。

　　1、Parallax Slider

　　一個超級棒的外掛，為你的網站提供縱深和滑動效果。

　　2、Javascript視差效果

　　一份幫助你增加網頁立體層次感的教程。

　　3、Nike Better World場景的背後

　　一份為那些急切想重現NIKE網站滾動效果的設計師準備的教程。

　　4、用jQuery和CSS構建一個具有視差滾動效果的網站介面

　　一份為那些想在此領域瞭解的更深的設計師準備的例子和教程。

　　5、用JQuery建立一個時尚的具有視差背景的效果

　　一份教程，在背景上幫你新增一些滾動的雲彩。

　　6、動畫背景式的網頁頭部

　　用一個動畫式的網頁頭部來讓你的訪問者為你歡呼吧！

　　7、視差滾動教程

　　一份視差效果和內容同時出現的有趣的教程。

　　8、JQuery Image Prallax

　　一個通過重複和動畫運動產生立體錯覺的外掛。

　　9、Stellar.js

　　一個為任何滾動元素提供視差滾動效果的JQuery外掛。

　　10、Curtain.js

　　允許你嵌入一個類似於幕布升起的效果到你的網頁中。

　　英文原文：10 Useful Tutorials And Plugins for creating Parallax and scrolling effects.