javascript - 禁用滚动但使用 JavaScript 捕获滚动数据？

Question

我试图阻止默认滚动行为，同时仍然确定用户尝试滚动的像素数。

我的目标是(在我页面的某个垂直位置)将导航元素固定到屏幕顶部并劫持滚动/滑动事件以在用户向上滚动时下拉移动菜单(因此移动所述元素上下移动 n 个像素，具体取决于用户尝试滚动的像素数)。

我知道在阻止 native 行为方面的用户体验/可访问性问题，但西装想要西装想要的。

到目前为止我有:

$('body').on({
 'mousewheel' : function(e) {
    e.preventDefault(); 
    e.stopPropagation();
 }
}); 

但我对如何访问滚动的像素数感到困惑(因为元素/滚动偏移不再是指南)。

编辑:请注意，此问题专门询问有关滚动被阻止时的鼠标/滚动操作的信息。不要认为这已被适本地标记为重复。

Answer 1

这取决于浏览器，因为您正在使用 mousewheel 事件。这是因为它是 non-standard .不要使用它!

在 Chrome (43.0) 中，您会获得具有不同值的不同属性:

e.originalEvent.wheelDelta: -120
e.originalEvent.wheelDeltaY: -120
e.originalEvent.deltaY: 100

在 IE (11.0) 中，您只能获取一个属性:

e.originalEvent.wheelDelta: -120

在 Firefox (38.0.5) 中，鼠标滚轮事件的捕获根本不起作用。

解决方案:
使用 wheel 事件 ( MDN reference )。此事件在所有浏览器中都具有 e.originalEvent.deltaY 属性。