我正在使用最新版本的fullpage.js,并将scrollOverflow 选项设置为true。就像这个例子... http://alvarotrigo.com/fullPage/examples/scrolling.html
Fullpage.js 使用 iscroll.js 作为此选项,并且我已经包含了 iscroll 的“probe”版本。就像这个例子... http://lab.cubiq.org/iscroll5/demos/probe/
iscroll-probe 能否报告当前正在滚动的整页“部分”的y 位置?
最佳答案
这确实是可能的。虽然 iScroll 库有 some bugs that were solved for its use in fullpage.js使用scrolloverflow.js 分支。我建议您自己在 iScroll Probe 中进行这些更改。
关于如何获取滚动位置,只需查看您提供的源示例即可知道要使用哪些 iscroll 事件。
然后,只需获取可通过以下方式提取的部分的 iscroll 实例:
$('.fp-section.active').find('.fp-scrollable').data('iscrollInstance');
或者从事件幻灯片:
$('.fp-section.active').find('.fp-slide.active').find('.fp-scrollable').data('iscrollInstance');
并使用 iScroll 选项probeType:3
,如其文档中所述。为此,请使用 scrollOverflowOptions
参数扩展默认的滚动溢出选项。
然后将它们混合在一起......
$('#fullpage').fullpage({
sectionsColor: ['yellow', 'orange', '#C0C0C0', '#ADD8E6'],
scrollOverflow:true,
scrollOverflowOptions: {
probeType: 3
},
afterLoad: function(anchorLink, index){
var iscroll = $('.fp-section.active').find('.fp-scrollable').data('iscrollInstance');
if(iscroll && typeof iscroll !== undefined){
iscroll.on('scroll', getScroll);
}
}
});
function getScroll(){
console.log(this.y);
$('#position').text(this.y);
}
关于javascript - 使用 Fullpage.js,scrollOverflow 滚动期间可以报告部分内的 y 位置吗? (使用 iscroll-probe),我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/39359639/