Javascript JQuery/JS：检测用户'；s在没有任何窗口溢出的情况下尝试滚动

我正在一个过渡网站上工作，虽然我想使用用户的滚动尝试作为过渡发起人，但我不希望有一个窗口滚动条

现在，我只是简单地检测到用户使用jquery的滚动（我将我的窗口大小设置为用户滚动条屏幕的1倍，尽管这是我试图避免的）

.scroll(function)

方法，并使用它来转换我的页面，但是我想检测用户的滚动尝试，而不必使我的页面溢出一个像素，从而显示滚动条

如何做到这一点

据我所知，出现混乱补丁的可能性：

将窗口定位在外包装中，并将滚动条隐藏在包装溢出中。这是修补工作，而不是解决方案。这会导致页面内容偏离中心，因为并非所有浏览器的滚动条宽度都相同

看看这个。我用它作为参考来做这件事

:

$（'html'）。在（'DOMMouseScroll'，函数（e）上{
var delta=e.originalEvent.detail；
if（δ<0）{
$（'p'）.text（'您向上滚动'）；
}否则如果（增量>0）{
$（'p'）.text（'您向下滚动了'）；
}
});

:

$（'html'）。在（'mouseweell'，函数（e）上{
var delta=e.originalEvent.wheelDelta；
if（δ<0）{
$（'p'）.text（'您向下滚动了'）；
}否则如果（增量>0）{
$（'p'）.text（'您向上滚动'）；
}
});

---

您必须将其绑定到横跨整个浏览器屏幕的元素上。

TreeTree的答案可以简化为一个支持所有浏览器的函数。合并mousewheel和DOMMouseScroll事件。但是，我的测试显示on（）在最新的Firefox中不起作用。改为使用bind（）。您还可以组合var delta声明以支持所有浏览器：

$('html').bind('mousewheel DOMMouseScroll', function (e) {
    var delta = (e.originalEvent.wheelDelta || -e.originalEvent.detail);

    if (delta < 0) {
        console.log('You scrolled down');
    } else if (delta > 0) {
        console.log('You scrolled up');
    }
});

$（'html'）.bind（'mousewheel-DOMMouseScroll'，函数（e）{
var delta=（e.originalEvent.wheelDelta | | |-e.originalEvent.detail）；
if（δ<0）{
log（“您向下滚动了”）；
}否则如果（增量>0）{
log（“您已向上滚动”）；
}
});

现代解决方案依赖于事件（IE9+）

---

测试此功能^brb选择事件现在已被弃用，甚至已被删除，并且将不起作用，请使用替换它们的控制盘事件这比mousewheel和DOMMouseScroll事件有更好的支持，即使答案中使用了“modern”关键字

$('html').on ('mousewheel', function (e) {
    var delta = e.originalEvent.wheelDelta;

    if (delta < 0) {
        $('p').text ('You scrolled down');
    } else if (delta > 0) {
        $('p').text ('You scrolled up');
    }
});

$('html').bind('mousewheel DOMMouseScroll', function (e) {
    var delta = (e.originalEvent.wheelDelta || -e.originalEvent.detail);

    if (delta < 0) {
        console.log('You scrolled down');
    } else if (delta > 0) {
        console.log('You scrolled up');
    }
});

$('selector').on('wheel', function(event) {
  var delta = {
    x: event.originalEvent.deltaX, 
    y: event.originalEvent.deltaY
  };

  if (delta.x != 0 || delta.y != 0) {
    //user scrolled
  }
});