pagePiling.js参数详解
pagePiling.js 这款 jQuery 插件可以帮助前端开发人员轻松实现全屏滚动效果。支持所有的主流浏览器，包括IE8+，支持移动设备。下面详细讲解下pagePiling.js的参数和函数。
1、pagePiling.js配置选项
| 属性/方法 | 类型 | 默认值 | 说明 |
|---|---|---|---|
| menu | 字符串 | null | 绑定菜单 |
| direction | 字符串 | vertical | 滚动方向，可选 vertical（垂直/竖向） 或 horizontal（水平/横向） |
| verticalCentered | 布尔值 | true | 内容垂直居中 |
| sectionsColor | 数组 | [] | “每一屏”的背景颜色 |
| anchors | 数组 | [] | 锚链接名称 |
| scrollingSpeed | 整数 | 700 | 动画时间 |
| easing | 字符串 | swing | 动画方式 |
| loopBottom | 布尔值 | false | 滚动到底部后循环滚动 |
| loopTop | 布尔值 | false | 滚动到顶部后循环滚动 |
| css3 | 布尔值 | true | 使用 css3 动画，如果浏览器不支持，则自动推到 js 动画 |
| navigation | 对象 | 定义导航文字颜色、背景颜色、位置和 tooltip | |
| normalScrollElements | 字符串 | null | 避免在某些元素上自动滚动，如地图，有滚动条的 div 等 |
| normalScrollElementTouchThreshold | 整数 | 5 | 设定一个阈值，以便在移动设备上滑动定义了 normalScrollElements 的元素 |
| touchSensitivity | 整数 | 5 | 触摸灵敏度 |
| keyboardScrolling | 布尔值 | true | 使用键盘控制 |
| sectionSelector | 字符串 | .section | 每一屏的选择器 |
| animateAnchor | 布尔值 | false | 是否以动画的方式滚动到某一个锚链接 |
| afterRender | 页面初始化后的回调函数 | ||
| onLeave | 滚动前的回调函数 function(index, nextIndex, direction){} |
||
| afterLoad | 滚动后的回调函数 function(anchorLink, index){} |
2、pagePiling.js自定义方法
| 名称 | 说明 |
|---|---|
| moveSectionUp() | 向上滚动，使用方法： $.fn.pagepiling.moveSectionUp(); |
| moveSectionDown() | 向下滚动，使用方法： $.fn.pagepiling.moveSectionDown(); |
| moveTo(section) | 滚动到某一屏，使用方法： $.fn.pagepiling.moveTo(3); 或者： $.fn.pagepiling.moveTo(‘page3′); |
| setAllowScrolling(boolean) | 允许/禁止滚动，使用方法： $.fn.pagepiling.setAllowScrolling(false); |
| setKeyboardScrolling(boolean) | 启用/禁止键盘控制，使用方法： $.fn.pagepiling.setKeyboardScrolling(false); |
| setScrollingSpeed(milliseconds) | 设置动画时间，使用方法： $.fn.pagepiling.setScrollingSpeed(800); |
2019年5月5日 下午8:11
好文章！666，学习了
2019年5月11日 上午1:21
写得太精彩了，以这样的篇幅写了这么大跨度的文章，精品。向楼主学习！