仅为div加载javascript函数

时间:2015-12-12 15:35:33

标签: javascript jquery html css

我正在尝试将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也会在此之后垂直滚动。

1 个答案:

答案 0 :(得分:1)

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

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

请参阅此fiddle