1.0.0 • Published 2 years ago
fe-fullpage-vue v1.0.0
安装
npm i fe-fullpage-vue -S使用
//import fullpage from "fe-fullpage-vue/fe-fullpage-ts.vue";
import fullpage from "fe-fullpage-vue/fe-fullpage.vue";
<fullpage>
<div></div>
<div></div>
<div></div>
</fullpage>说明
- fe-fullpage-vue是根据x-fullpage-vue修改而来，主要修复了滚动标签太多时的高度偏移问题
使用需注意
- 建议子标签的数量在2个以上
- fullpage标签下的子标签直接为要全屏滚动的元素
- fullpage 自动计算每个子标签的高度，因此可以给定高度，也可以不用给定高度
- overflowY 移动端浏览器打开向上滚动，导致移动偏移,因此需要隐藏
参数
| 参数 | 类型 | 默认值 | 备注 | |
|---|---|---|---|---|
| skip | Number | 0 | 跳转指定页面 | 当前页码 (从0开始计数) |
| overflowY | Boolean | false | 是否允许横向滚动 (仅PC设备生效) | |
| width | String | 1920px | overflowY=true生效 | |
| abs | Number | 1 | 间隔页面 | 与isTransition配合使用 |
| isTransition | Boolean | true | 一次性跳转多个页面的时候，是否显示过渡 | |
| devices | Number | 800 | 设备最小宽度 | 主要是区分手机与pc,之后重新计算节点信息 |
方法
| 方法名 | 参数 | 备注 |
|---|---|---|
| scroll | page | 当前页码 (从0开始计数) |
| mousemove | direction | 滚动方向 |
| init | nodesInfo | 所有节点信息集合 |
1.0.0
2 years ago