如何检测jQuery中的水平滚动？答案

【问题标题】：How to detect horizontal scrolling in jQuery?如何检测jQuery中的水平滚动？
【发布时间】：2011-10-27 22:51:39
【问题描述】：

如何使用 jQuery 检测水平滚动？

这将获得所有卷轴：

$(window).scroll(function () {
    alert('in');
});

我只想要水平的。

【问题讨论】：

标签： jquery scroll

【解决方案1】：

这似乎行得通。

var lastScrollLeft = 0;
$(window).scroll(function() {
    var documentScrollLeft = $(document).scrollLeft();
    if (lastScrollLeft != documentScrollLeft) {
        console.log('scroll x');
        lastScrollLeft = documentScrollLeft;
    }
});

jsFiddle.

【讨论】：

为什么我们需要 .scroll();最后？
@Aharon 那是我前世的附录。现在没有必要，我会更新我的答案:)
这只会增加值。我如何在向右时增加它并在向左时减少它你知道吗？提前致谢。
解决了！ link。仅水平更改 .scrollTop() 为 .scrollLeft() 并准备就绪！希望能帮助别人。
你能告诉我如何检测 div 中滚动的结束吗？就像我们可以使用 scrollTop 和 scrollHeight 检测到用户到达滚动的底端一样，但是如何在水平方向检测到相同的？

【解决方案2】：

根据上面的代码在水平滚动中显示向左或向右方向的更新：

var lastPos = 0;
$(window).scroll(function() {
    var currPos = $(document).scrollLeft();

    if (lastPos < currPos) {
        console.log('scroll right');
    } 
    if (lastPos > currPos) 
    {
        console.log('scroll left');
    }

    lastPos = currPos;
});

测试它在 http://jsfiddle.net/EsPk7/7/

【讨论】：

【解决方案3】：

dunderwood 的 jsFiddle 链接实际上并不包含他的代码。我已经用他在这里发布的内容和 jsFiddle 上的内容混合了他的 jsFiddle：

var lastPos = 0;
$(window).scroll(function() {
    var currPos = $(document).scrollLeft();

    if (lastPos < currPos) {
        $('#current').html('Right');
    }
    if (lastPos > currPos) {
        $('#current').html('Left');
    }

    lastPos = currPos;
});

http://jsfiddle.net/kuVK8/

【讨论】：

有点问题。当您上/下时，左右书写。有什么解决办法吗？

【解决方案4】：

window.onresize = function() { 
    if ( $("div").outerWidth() < $("div").get(0).scrollWidth ) {
        console.log("foo bar scrollbar");
    } else {
        console.log(" no scrolling ");
    }
};

【讨论】：

您能否解释一下为什么这可以解决问题？关于 SO 的好答案总是有其背后的解释。