Fullpage.js是一個用于整屏切換的js插件，可以做出非常好看的頁面整屏切換效果。它主要功能有：1.支持鼠標滾動；2.支持前進后退和鍵盤控制；3.多個回調函數；4.支持手機、平板觸摸事件；5.支持 CSS3 動畫；6.支持窗口縮放；7.窗口縮放時自動調整；8.可設置滾動寬度、背景顏色、滾動速度、循環選項、回調、文本對齊方式等等。
使用需要先引入fullpage.css和fullpage.js，其兼容性除了IE8一下，其他主流瀏覽器都有較好的支持，大可放心使用。
Html結構如下圖：

Js如圖：



Fullpage.js有需多參數來設置你需要的炫酷效果如圖：


還有許多方法來實現功能：
moveSectionUp()：向上滾動一個 section；
moveSectionDown()：向下滾動一個 section；
moveTo(section, slide)：將頁面滾動到目標 section 和滑動。section 從 1 開始，slide 從 0 開始。；
moveSlideRight()：將當前 slide 的水平滑塊滾動到下一張 slide ；
moveSlideLeft()：將當前 slide 的水平滑塊滾動到上一張 slide；
setAutoScrolling()：動態設置 autoScrolling 。 定義頁面滾動行為的方式。 如果設置為 true，則將使用"自動"滾動，否則將使用站點的"手動"或"正常"滾動；
setAllowScrolling()：添加或者禁止 fullpage 自動綁定的鼠標滑輪和移動觸摸事件；
setKeyboardScrolling()：添加或者禁止鍵盤對 section/slide 的控制（默認綁定）；
setScrollingSpeed()：定義以毫秒為單位的滾動速度；
回調函數功能：
afterLoad：滾動到某一屏后的回調函數，接收 anchorLink 和 index 兩個參數，anchorLink 是錨鏈接的名稱，index 是序號，從1開始計算。
onLeave：滾動前的回調函數，接收 index、nextIndex 和 direction 3個參數：index 是離開的“頁面”的序號，從1開始計算；nextIndex 是滾動到的“頁面”的序號，從1開始計算；direction 判斷往上滾動還是往下滾動，值是 up 或 down。
afterRender：頁面結構生成后的回調函數，或者說頁面初始化完成后的回調函數。
afterSlideLoad：滾動到某一水平滑塊后的回調函數，與 afterLoad 類似，接收 anchorLink、index、slideIndex、direction 4個參數。
onSlideLeave：某一水平滑塊滾動前的回調函數，與 onLeave 類似，接收 anchorLink、index、slideIndex、direction 4個參數。