fullpage 全屏插件的功能介绍

最新推荐文章于 2021-01-06 04:10:59 发布

wenxin_liu

最新推荐文章于 2021-01-06 04:10:59 发布

阅读量227

点赞数

本文链接：https://blog.csdn.net/wenxin_liu/article/details/106457208

版权

fullPage.js是一个基于jQuery的全屏滚动插件，简化了全屏滚动效果的实现，支持鼠标滚轮、前进后退、键盘控制、手机触摸及CSS3动画等。该插件提供丰富的配置参数，如verticalCentered、scrollingSpeed、easing等，允许自定义滚动速度、动画方式、背景颜色等，并可绑定菜单和导航。同时，还支持窗口缩放的自动调整和内容超出门框时的滚动条显示。

摘要由CSDN通过智能技术生成

简介

fullpage 全屏插件
全屏滚动效果，原生js也很好实现，主要是用 mousewheel 鼠标滚轮滚动事件，来判断上滚动还是下滚动，之后设置每次滚动的高度为屏幕的高度即可。但是，虽然效果简单，但是兼容性很差，要做很多兼容处理及比较麻烦啦！fullPage.js 是一个基于 jQuery 的插件，它能够帮你很方便、很轻松的制作出全屏网站。

主要功能有：

支持鼠标滚动
支持前进后退和键盘控制
多个回调函数
-支持手机、平板触摸事件
支持 CSS3 动画
支持窗口缩放
窗口缩放时自动调整
可设置滚动宽度、背景颜色、滚动速度、循环选项、回调、文本对齐方式等等

fullpage 详细参数

    选项                 　　　　　　　　 类型                   默认值               　　  说明

verticalCentered 　　　　　　　　字符串 true 　　内容是否垂直居中
resize 　　　　　　　　布尔值 false 　　字体是否随着窗口缩放而缩放
sectionColor 　　　　　　　　函数无　　设置背景颜色
anchors 　　　　　　　　数组无　　定义锚链接
scrollingSpeed 　　　　　　　　整数 700 　　滚动速度，单位为毫秒
easing 　　　　　　　　字符串 easeInQuart 　　滚动动画方式
menu 　　　　　　　　布尔值 false 　绑定菜单，设定的相关属性与 anchors 的值对应后，菜单可以控制滚动 |