❶ 请问谁用过fullPage.js,用于全屏滚动的.当页面内容过多,而浏览器屏幕不能显示完全内容时怎么办啊
添加一源个参数，scrollOverflow
导入jquery.fullPage.js时候，顺便也导入jquery.slimscroll.js.
$(".className").fullpage({
scrollOverflow: true
});
可以试一下
❷ web开发：全屏滚动插件fullpage.js
全屏滚动插件fullpage.js为前端开发提供了美观的全屏滚动效果，提升用户体验。
官网演示，仅通过滚动鼠标滚轮，即可实现页面翻页。
fullpage.js的安装方式在文档中已有详细说明，可直接在项目中引入。对于使用webpack等打包工具的单页面应用，引入方式与文档提供的示例相符。
在React项目中集成fullpage.js，创建相关组件即可实现基本功能。填充内容及根据需求配置后，页面展示效果已初步实现。
欲将某页面设为默认展示，只需为其添加.active类。例如，指定为Some section。
导航小圆点功能对页面导航极为实用，其引入方法简便，可直接应用于页面。
页面中通常需要设置锚点，点击后跳转至对应位置。官方文档提供使用方式，需在HTML标签中添加.data-anchor属性。
然而在React项目中使用HashRouter时，可能会遇到锚点无法正常工作的问题，因为HashRouter模式下，#会被当作hash处理。若不使用HashRouter，可能在页面刷新时出现未找到页面的情况。
解决方案之一是使用fullpage_api.moveTo()方法进行页面控制，但这远不如锚点功能使用便捷。
值得注意的是，fullpage.js除了原生版本外，还提供了React、Vue和Angular的封装版本，这些封装版在原基础上做了功能适配。
集成使用方法与原版相似，将示例修改为对应框架的写法即可。
希望这篇内容对您在全屏滚动插件fullpage.js的应用中有所帮助。如有疑问或需要更多细节，请随时查找官方文档或社区资源。
❸ jquery.fullpage.min.js 这个全屏滚动插件，怎么让页面初始化也就是第一页就有动画效果
把第一页的 <li data-menuanchor="page1" class="active"> 里面的class="active" 去掉 默认一开始就不显示第一个了
如果第一页不显示了，在页面初始化的地方 给它加上active这个class属性 就能实现初始化第一页就有动画效果了
afterRender以你的代码给你举个例子
$.fn.fullpage({
slidesColor: ['#fff', '#fff', '#fff', '#fff', '#fff'],
anchors: ['page1', 'page2', 'page3', 'page4', 'page5'],
menu: '#menu',
afterRender: function(){
alert('ok');
}
});
给你一个参考地址：
http://www.dowebok.com/78.html
❹ 移动端可以兼容fullpage.js吗
可以。
fullpage.js全屏滚动插件，基于jq库，可以利用它很方便、很轻松的来制作全屏网站；它
支持手机、平板触摸事件，也支持 CSS3 动画，对移动端有很好的兼容性。
❺ "jquery.fullpage.min.js"这个全屏滚动插件，怎么让页面初始化就有动画
//需要连接连接的三个文件
<linkrel="stylesheet"href="css/jquery.fullPage.css">//css文件
<scriptsrc="js/jquery-1.8.3.min.js"></script>//jQuery1.8.3的版本
<scriptsrc="js/jquery.fullPage.min.js"></script>//fullPage插件的压缩版本
<style>
.section{text-align:center;font:50px"MicrosoftYahei";color:#fff;}//可以改动设置的是网页中的文字<无关紧要></style>
<script>
$(function(){$('#dowebok').fullpage({//fullpage比较重要设置的是插件的基本设置后面的
sectionsColor:['#1bbc9b','#4BBFC3','#7BAABE','#f90']
//sectionsColor当没有背景图片的时候这个就是设置背景颜色的否则就是空白数组的形式中间以逗号隔开颜色不管是十六进制还是英文单词都需要用单引号包着
});
});
</script>
<divid="dowebok">//绑定的大盒子设置滚动的盒子
<divclass="section">
<h3>第一屏</h3>
<p>fullPage.js—基本演示</p>
</div>
<divclass="section">//滚动的第二屏幕如果在里面添加div和slide的样式就可以增加横向点击
<divclass="slide"><h3>第二屏的第一屏</h3></div>
<divclass="slide"><h3>第二屏的第二屏</h3></div>
<divclass="slide"><h3>第二屏的第三屏</h3></div>
</div>
<divclass="section">
<h3>第三屏</h3>
</div>
<divclass="section">
<h3>第四屏</h3>
<p>这是最后一屏</p>
</div>
</div>
0.02插入背景图片演示的HTML布局以及js代码<需要链接的文件都是一样的>
<style>//需要注意的是这里没有设置颜色而是在css中设置的背景图片0
.section1{background:url(images/1.jpg)50%;}.section2{background:url(images/2.jpg)50%;}.section3{background:url(images/3.jpg)50%;}.section4{background:url(images/4.jpg)50%;}</style>
<script>
$(function(){$('#dowebok').fullpage();//找到大盒子设置fullpage全屏滚动});
</script>
<divid="dowebok">
<divclass="sectionsection1"></div>
<divclass="sectionsection2"></div>
<divclass="sectionsection3"></div>
<divclass="sectionsection4"></div>
</div>
0.03循环演示html布局以及js代码<需要链接的文件都是一样的>
<script>
$(function(){$('#dowebok').fullpage({sectionsColor:['#1bbc9b','#4BBFC3','#7BAABE','#f90'],//和上面一样sectionsColor是设置每一屏的颜色必须用逗号隔开单引号包着
continuousVertical:false,//设置是否滑到底层再往下滚动是第一张图设置true是执行此操作设置false是不执行默认不执行不执行就不设置
});
});
</script>
<divid="dowebok">
<divclass="section">
<h3>第一屏</h3>
<p>fullPage.js—循环演示</p>
</div>
<divclass="section">
<h3>第二屏</h3>
</div>
<divclass="section">
<h3>第三屏</h3>
</div>
<divclass="section">
<h3>第四屏</h3>
<p>这是最后一屏了，继续往下滚返回第一屏</p>
</div>
</div>
0.04回调函数演示
<title>fullPage.js—回调函数演示</title>
<linkrel="stylesheet"href="css/jquery.fullPage.css">
<style>
.section{text-align:center;font:50px"MicrosoftYahei";color:#fff;}.section2p{position:relative;left:-120%;}.section3p{position:relative;bottom:-120%;}.section4p{display:none;}</style>
<scriptsrc="js/jquery.min.js"></script>
<scriptsrc="js/jquery-ui.js"></script>
<scriptsrc="js/jquery.fullPage.js"></script>
<script>
$(function(){$('#dowebok').fullpage({sectionsColor:['#1bbc9b','#4BBFC3','#7BAABE','#f90'],
//设置背景颜色
afterLoad:function(anchorLink,index){//滚动到某一屏后的回调函数，接收anchorLink和index两个参数，anchorLink是锚链接的名称，index是序号，从1开始计算
if(index==2){$('.section2').find('p').delay(500).animate({//find('p')搜索所有段落中的后代p元素//delay(500)其中参数为延时值，它的单位是毫秒
//animate()方法执行CSS属性集的自定义动画
left:'0'
},1500,'easeOutExpo');//jQueryEasing动画效果扩展
}
if(index==3){$('.section3').find('p').delay(500).animate({bottom:'0'
},1500,'easeOutExpo');
}
if(index==4){$('.section4').find('p').fadeIn(2000);//fadeIn()方法逐渐改变被选元素的不透明度，从隐藏到可见（褪色效果）
}
},
onLeave:function(index,direction){//滚动前的回调函数，接收index、nextIndex和direction3个参数：index是离开的“页面”的序号，从1开始计算；
//nextIndex是滚动到的“页面”的序号，从1开始计算；
//direction判断往上滚动还是往下滚动，值是up或down。
if(index=='2'){$('.section2').find('p').delay(500).animate({left:'-120%'
},1500,'easeOutExpo');
}
if(index=='3'){$('.section3').find('p').delay(500).animate({bottom:'-120%'
},1500,'easeOutExpo');
}
if(index=='4'){$('.section4').find('p').fadeOut(2000);//fadeOut()方法逐渐改变被选元素的不透明度，从可见到隐藏（褪色效果）
}
},
continuousVertical:false,
//是否循环滚动，与loopTop及loopBottom不兼容
});
});
</script>
<divid="dowebok">
<divclass="sectionsection1">
<h3>第一屏</h3>
<p>fullPage.js—回调函数演示</p>
</div>
<divclass="sectionsection2">
<h3>第二屏</h3>
<p>滚动到第二屏后的回调函数执行的效果</p>
</div>
<divclass="sectionsection3">
<h3>第三屏</h3>
<p>滚动到第三屏后的回调函数执行的效果</p>
</div>
<divclass="sectionsection4">
<h3>第四屏</h3>
<p>滚动到第四屏后的回调函数执行的效果</p>
</div>
</div>