JavaScript检测左滚动

Question

当div向左滚动时，我应该添加什么代码来触发一段代码块？

<script>
(function () {
    function scrollH(e) {
        e = window.event || e;
        var delta = Math.max(-1, Math.min(1, (e.wheelDelta || -e.detail)));
        document.getElementById('myDiv').scrollLeft -= (delta * 40);
        e.preventDefault();
    }
    if (window.addEventListener) {
        window.addEventListener("mousewheel", scrollH, false);
        window.addEventListener("DOMMouseScroll", scrollH, false);
    } else {
        window.attachEvent("onmousewheel", scrollH);
    }
    if "scrollingLeft" {
        // do something
    }
    else
    {
        // do something else
    }
})();
</script>

到目前为止，我尝试了以下方法，但均无效：

var isleft = e.delta < 0;
if isleft = true { do something }

- Kayley Jane

Answer 1

如此处所述，您可以通过以下方式处理水平滚动：

$("#someContainer").on("scroll", function (e) {
    horizontal = e.currentTarget.scrollLeft;
    vertical = e.currentTarget.scrollTop;
});

在这种情况下，这将绑定此元素上的所有滚动事件，因此您也可以通过e.currentTarget.scrollTop处理垂直滚动，以及通过e.currentTarget.scrollLeft处理水平滚动。

- ProEvilz

---

它也应该能够工作，但只有在页面真正滚动时才可以。 - B 7

Answer 2

这个解决方案可以检测DOM事件。div不需要有滚动条。

使用以下代码片段，您应该能够检测滚动方向：

$(window).on('DOMMouseScroll mousewheel', function (e) {
  if(e.originalEvent.detail > 0 || e.originalEvent.wheelDeltaX < 0) { //alternative options for wheelData: wheelDeltaX & wheelDeltaY
    //scroll right
    console.log("RIGHT");
  } else {
    //scroll left
    console.log("LEFT");
  }

  //prevent page fom scrolling
  return false;
});

它应该适用于所有浏览器。如果需要检测水平方向，请将wheelDeltaX替换为wheelDeltaY

如果您想检测滚动方向并让页面滚动，return true在结尾处。

- B 7