13. Windows

Windows (github) 是一個(gè)讓你用占據(jù)整個(gè)屏幕的section來構(gòu)建單面網(wǎng)站的插件。該插件提供給你一些回調(diào)函數(shù)，當(dāng)新的section出現(xiàn)在可視區(qū)并且并且處理快照時(shí)被調(diào)用，所以你可以輕松的繼承它來自定義導(dǎo)航菜單或更多的東西。下面是一個(gè)例子：譯者注：點(diǎn)擊每個(gè)章節(jié)，僅Chrome和Safari可用。

?

1 2 3 4 5 6 7 8 9 10 11 12 13 14

$('.window').<a title="windows" href="http://www.woiweb.net/tag/windows">windows</a>({ ????snapping: true, ????snapSpeed: 500, ????snapInterval: 1100, ????onScroll: function(scrollPos){ ????????// scrollPos:Number ????}, ????onSnapComplete: function($el){ ????????// after window ($el) snaps into place ????}, ????onWindowEnter: function($el){ ????????// when new window ($el) enters viewport ????} });

14. Cool Kitten

Cook Kitten (github) 是一個(gè)用于視差滾動(dòng)網(wǎng)站的響應(yīng)式的框架，它把你網(wǎng)站中的section組織成一個(gè)幻燈片并且使用 jQuery Waypoints 插件來檢測它們何時(shí)進(jìn)入到可視區(qū)，并觸發(fā)導(dǎo)航菜單的更新。譯者注：點(diǎn)擊導(dǎo)航菜單看效果，支持Firefox,Chrom,Opera,Safari,IE9+。

15. Sticky

Sticky (github) 是一個(gè)當(dāng)頁面滾動(dòng)時(shí)使你頁面上的任何元素始終保持顯示的插件，這能使你單頁網(wǎng)站展示一個(gè)粘性的導(dǎo)航菜單或者分享工具條很便利。 它可直接使用，僅有的選項(xiàng)是頂部的offset：

1	$("#sticker").sticky({topSpacing:0});

16. Super Scrollorama

Super Scrollorama (github)是一個(gè)滾動(dòng)動(dòng)畫很酷的jQuery插件，它可使你定義當(dāng)一個(gè)元素出現(xiàn)在視圖中或特定的滾動(dòng)點(diǎn)上的tweens和animations。

1 2 3 4 5

$(document).ready(function() { ??var controller = $.superscrollorama(); ??controller.addTween('#fade', ????TweenMax.from($('#fade'), .5, {css:{opacity:0}})); });

?

17. Stellar.js

Stellar.js (github)是一個(gè)對(duì)任何滾動(dòng)元素提供視差滾動(dòng)效果的jQuery插件，它在特殊元素中尋找任何視差背景和元素，并且當(dāng)元素滾動(dòng)時(shí)重新放置它們。你可通過使用data 屬性控制元素的滾動(dòng)速度：

1	$('#main').stellar();

18. Scrollpath

Scrollpath (github)是另一個(gè)滾動(dòng)插件，但與前面的插件有所不同的是你可以自己定義滾動(dòng)路徑。該插件使用canvas的寫作風(fēng)格來繪制路徑，使用 moveTo, lineTo 和arc. 為幫助路徑正確，在初始化插件時(shí)可使帶路徑的canvas遮罩層。譯者注：這個(gè)真心贊一下。

參考：

• http://woiweb.iteye.com/blog/1878697
• http://www.woiweb.net/50-amazing-jquery-plugins-2.html

總結(jié)

以上是生活随笔為你收集整理的视差滚动(Parallax Scrolling)插件补充的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯(cuò)，歡迎將生活随笔推薦給好友。