我使用以下iScroll 5代码(通常,它并不那么重要:只是一个普通的逐页滚动):
var myScroll = new IScroll('.scroller', {
mouseWheel: true,
scrollbars: true,
keyBindings: {
// doesn't matter
},
preventDefault: false,
fadeScrollbars: true,
snap: 'section', // <-- that's the key
wheelAction: 'scroll',
});
myScroll.on('beforeScrollStart', function (e) {
myScroll.preventDisabling = true;
});
myScroll.on('scrollMove', function (e) {
});
myScroll.on('scrollStart', function (e) {
// !!! I need the detection somewhere here !!!
if (!myScroll.preventDisabling) {
myScroll.disable();
disabledWasCalledInMeanwhile = true;
}
myScroll.preventDisabling = false;
});
var disabledWasCalledInMeanwhile = false;
// that's just to prevent jumping to another page before scrolling is finished
myScroll.on('scrollEnd', function (e) {
disabledWasCalledInMeanwhile = false;
window.setTimeout(function () {
if (!disabledWasCalledInMeanwhile)
myScroll.enable();
}, 250);
$('.labels>*').toggleClass('active', false)
.eq(this.currentPage.pageY).toggleClass('active', true);
});
myScroll.on('scrollCancel', function (e) {
myScroll.enable();
});
因此,有没有机会在
beforeScrollStart
或scrollStart
中检测到我要滚动到的页面?触发页面项目动画要知道这一点很重要。谢谢! 最佳答案
我已经使用iScroll多年(这是一个出色的库),但我不知道这样做的内置方法。确定iScroll捕捉之前的所有滚动事件(scrollEnd除外)。但是,我认为只需稍加修改即可。
首先,进入iScroll.js源代码并找到_nearestSnap方法。在方法的底部,您将找到要返回的对象。在返回之前,获取该数据并将其传递给自定义事件。不幸的是,iScroll的事件系统不允许您将自定义变量传递给事件,因此您必须进行变通。另外,您将需要跟踪“ flick”事件,因为它不会触发_nearestSnap方法。
_nearestSnap方法中的iScroll修改
this.customSnap({
x: x,
y: y,
pageX: i,
pageY: m
});
更新到类实例。注意“ customSnap”方法和flick事件的添加。
myScroll = new IScroll('#wrapper', {snap: "p"});
myScroll.customSnap = function(data) {
console.log(data);
};
myScroll.on('flick', function() {
console.log(data.currentPage);
});
那应该做。不一定是最干净的更新,但是在我的测试中,它确实有效。
http://jsfiddle.net/9pa4th4y/
关于javascript - 当前滚动到检测的iScroll页面,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/25538052/