鼠标滚轮倾斜与滚动 JavaScript、scrollTop

Question

有些电脑鼠标有 scroll wheel that can be tilted left and right。

这允许在 Google's piano roll app (code is here) 中导航时间维度。

我有以下目标：

1. 使钢琴卷轴垂直而不是水平。这是一个在不同应用程序中滚动的带有垂直条的图像，仅作为示例：

2. 允许通常的垂直鼠标滚轮滚动来导航时间维度（而不是当前的鼠标滚轮 left/right 倾斜）。

我通过替换

实现了第一个目标

this.context.translate(-offset * 2, 0);

here 作者

this.context.translate(0, offset * 2);

并通过将 left 与 top 和 height 与 width 交换并更改一些符号 here (codebase here).

但是，时间维度仍然响应鼠标滚轮 left/right 倾斜而不是通常的垂直鼠标滚轮滚动。它可能与the file Scroll.js有关。我尝试用 scrollTop 和类似的东西替换 scrollLeft，但这破坏了当前可用的功能。有关水平滚动的信息如何传递的任何提示？

（获取运行的代码：npm install，solutions to error C2664。然后从pianoroll目录调用node_modules/.bin/webpack -p。打开index.html. 要获得声音：先单击钢琴符号，然后单击播放。)

Answer 1

在roll.scss中替换

    overflow-y: hidden;
    overflow-x: scroll;

来自

    overflow-x: hidden;
    overflow-y: scroll;

没有这个修改，scrollTop 没有改变。