iScroll 5 容器边界检测滚动鼠标滚轮和触摸答案

【问题标题】：iScroll 5 container boundaries detection scrolling with mousewheel and touchiScroll 5 容器边界检测滚动鼠标滚轮和触摸
【发布时间】：2014-04-02 06:47:41
【问题描述】：

我将 iScroll 5 与 fullpage.js 一起使用，因为 fullpage.js 提供的解决方案不是我需要的。

我的页面有 3 个整页部分。第二部分有一个垂直滚动的内容。

我需要做的是检测我的可滚动内容何时位于父元素的边界（顶部和底部），然后如果我再次执行滚动（鼠标滚轮或触摸），它会触发一个事件。

这是一个 Fiddle 的问题。

我需要这样的东西：

$('.scrollwrapper').on("mousewheel touchmove", function() {
    if ("scroll is on max top"){
        $(this).on("wheelUp touchmoveUp", function() {
            $.fn.fullpage.moveSectionUp();
        });
    }else if ("scroll is on max bottom"){
        $(this).on("wheelDown touchmoveDown", function() {
            $.fn.fullpage.moveSectionDown();
        });
    }
});

希望你能帮助我，我将不胜感激。

【问题讨论】：

你的问题一点都不清楚。您能告诉我们您遇到的问题是什么吗？另外，您为什么不使用创建滚动条的选项scrollOverflow？
我没有使用scrollOverflow 选项，因为它触发了启动另一个名为 slimScroll 的第 3 方插件的功能，而这个不符合我的需要。我需要但不知道该怎么做，是检测用户何时达到 iScroll5 元素的最大和最小滚动，然后如果用户再次向同一方向滚动，则触发另一个函数，逻辑与我在上面写的相同那段代码。
您需要查看 iScroll 文档以了解他们是否有任何回调。
他们没有，但我已经看到了该回调函数的一些 iScroll4 实现，不幸的是，它们都不适用于 iScroll5。

标签： javascript mousewheel iscroll fullpage.js touchmove

【解决方案1】：

你可以试试这样的

xpScroll.on('scrollEnd', function(){
    var scrollY = xpScroll.y + 15;
    var scrollH = $('.xp-scroll').height() - $(window).height();
    var scrollEnd = scrollH + scrollY;

    if (scrollEnd == 0) {
        alert('End');
    }
});

http://jsfiddle.net/fF4BJ/1/ 在你的小提琴中为我工作。要向上滚动，请使用您的数学技能。

【讨论】：