jquery-fullpage是一個(gè)強(qiáng)大的全屏滾動(dòng)插件,它提供了許多可定制的選項(xiàng)和參數(shù),可以幫助我們實(shí)現(xiàn)各種滾動(dòng)效果。以下是一些重要的參數(shù):
// 導(dǎo)航 menu: '#menu', // 導(dǎo)航菜單的選擇器 anchors: ['home', 'about', 'products', 'contact'], // 導(dǎo)航錨點(diǎn),對(duì)應(yīng)每個(gè)頁(yè)面的id // 滾動(dòng)控制 scrollingSpeed: 700, // 頁(yè)面滾動(dòng)的速度 scrollOverflow: true, // 是否允許頁(yè)面滾動(dòng) scrollBar: true, // 是否顯示滾動(dòng)條 // 回調(diào)函數(shù) afterLoad: function(origin, destination, direction){...}, // 頁(yè)面加載完成的回調(diào)函數(shù) onLeave: function(origin, destination, direction){...}, // 頁(yè)面離開(kāi)時(shí)的回調(diào)函數(shù) afterRender: function(){...}, // 頁(yè)面渲染完成的回調(diào)函數(shù) afterResize: function(width, height){...}, // 窗口大小改變后的回調(diào)函數(shù) // CSS3特效 css3: true, // 是否使用CSS3過(guò)渡 easingcss3: 'ease-out', // CSS3過(guò)渡的緩動(dòng)函數(shù) // 更多選項(xiàng) verticalCentered: true, // 頁(yè)面內(nèi)容是否垂直居中 sectionsColor: ['#f2f2f2', '#4BBFC3', '#7BAABE'], // 每個(gè)頁(yè)面的背景色 normalScrollElements: '.scrollable-element', // 允許滾動(dòng)的元素
以上是jquery-fullpage的一些常用參數(shù),可以根據(jù)需要進(jìn)行選擇和定制,實(shí)現(xiàn)各種滾動(dòng)效果。需要注意的是,有些參數(shù)需要配合CSS樣式和HTML結(jié)構(gòu)一起使用,才能達(dá)到最好的效果。