如何防止人们使用鼠标滚轮滚动我们的触摸拖动？

Question

在HTML / CSS / JS中，有一件事我无法搞清楚： 如何防止人们使用鼠标滚轮按下滚动元素（即按住鼠标滚轮并拖动，或单击鼠标滚轮，拖动，再次单击鼠标滚轮）以及当人们尝试拖动元素时如何执行相同操作在触摸设备上。

在尝试制作汉堡式菜单时，我偶然发现了这一点。

将元素的CSS设置为 overflow：hidden 将隐藏滚动条，但使用上述两种方法，仍然可以轻松滚动它们。 到目前为止，唯一的解决方案是＆＃39;我发现是制作第二个元素，并将其放置在不应该可滚动的元素之上。但这对我来说似乎不是一个完美的解决方案。

• 如何使用JavaScript捕获这些事件？
• 当菜单打开时，如何在this page上水平和垂直滚动？

Answer 1

如果您创建了一个jsfiddle，我们可以提供更好的解决方案。如果你对jquery没问题，我可以为你的第二点提供一些解决方案＆＃34;例如，当菜单打开时，如何在水平和垂直方向上滚动这个页面？＆＃34;。

首先，你需要创建一个简单的类，如下所示。

.overhidden
{
 overflow:hidden !important;
}

接下来，当您按下屏幕上的菜单图标时，我们需要应用此课程。如果他们再次点击关闭我们也需要删除。在下面的jquery中很容易做到。

 $(document).ready(function(){
   $('#hamburger').click(function(){
      $('body').toggleClass('overhidden');
   });
 });