FullPageScroll 轻量级纯 JS 全页面滚动插件

简介

FullPageScroll  是一个纯 JS 轻量级插件，它使用纯 JS 为您的单页web应用程序实现了触摸式全屏单页滚动效果。

（下载的附件中附有DEMO）

更多单页滚动插件：👉  [ 详情 ]

使用

1.  引入文件

<script src="/path/to/fullPage.min.js"></script>

2.  HTML

<div id="main">
  <section class="section"></section>
  <section class="section"></section>
  <section class="section"></section>
  <section class="section"></section>
  ...
</div>

3.  调用

var page = new FullPage("#main");

4.  配置

var page = new FullPage("#main",{
    // section selector
    section: '.section',
    // animation options
    animationDuration: 700,
    animationTiming: 'ease',
    animationTranform: 'transform',
    // enable side navigation
    pagination: true,
    // enable keyboard navigation
    keyboard: true,
    // enable touch events
    touch: true,
    // touch limit in ms
    touchLimit: 100,
    // infinite loop
    loop: false,
    // callbacks
    onLeave: null,
    afterLoad: null,
    
});

5.  将网页滚动到特定部分

page.moveTo(index);

相关链接

易助科技网效果演示地址： http://demo.easyzone.net.cn/plugin/FullPageScroll/index.html