javascript - 单独为一个 div 加载 javascript 函数

Question

我正在尝试让一个 div 水平滚动而另一个 div 垂直滚动(实际上是其余部分)，但我不知道如何只对一个 div 使用一段特定的代码。

    (function() {
function scrollHorizontally(e) {
    e = window.event || e;
    var delta = Math.max(-1, Math.min(1, (e.wheelDelta || -e.detail)));
    document.documentElement.scrollLeft -= (delta*40); // Multiplied by 40
    document.body.scrollLeft -= (delta*40); // Multiplied by 40
    e.preventDefault();
}
if (window.addEventListener) {
    // IE9, Chrome, Safari, Opera
    window.addEventListener("mousewheel", scrollHorizontally, false);
    // Firefox
    window.addEventListener("DOMMouseScroll", scrollHorizontally, false);
} else {
    // IE 6/7/8
    window.attachEvent("onmousewheel", scrollHorizontally);
}
})();

http://jsfiddle.net/27mjq1ue/1/

我希望“div1”水平滚动，“div2 - div5”垂直滚动，但我的代码适用于整个文档。

总结一下:我访问网站 > 我向下滚动，在向下滚动时 div1 水平滚动 > 当 div1 完成滚动时，div2 开始垂直滚动 > div3、div4、div5 之后也垂直滚动。

Answer 1

我通过添加 if 检查滚动事件的目标来更新你的 fiddle ，如果它是 div1，则水平滚动，否则什么也不做，这意味着让默认滚动行为发生。

if (e.target.id === 'div1') {
  ...
}

查看此 fiddle