在 HTML/CSS/JS 中,有一件事我很难搞清楚: 如何防止人们使用鼠标滚轮按下来滚动元素(即按住鼠标滚轮并拖动,或单击鼠标滚轮,拖动,再次单击鼠标滚轮)以及当人们尝试拖动元素时如何做同样的事情在触摸设备上。
这是我在尝试制作汉堡式菜单时偶然发现的东西。
将元素的 CSS 设置为 overflow: hidden 将隐藏滚动条,但使用以上两种方法,仍然可以轻松滚动滚动条。 到目前为止,我发现的唯一“解决方案”是制作第二个元素,并将其放置在不应滚动的元素之上。但这对我来说似乎不是一个完美的解决方案。
- 如何使用 JavaScript 捕获这些事件?
- 如何,例如,this page , 菜单打开时水平和垂直滚动被阻止?
最佳答案
如果您创建一个 jsfiddle,我们可以提供更好的解决方案。如果您对 jquery 没问题,我可以针对您的第二点“例如,在这个页面上,当菜单打开时如何阻止水平和垂直滚动?”我可以提供一些解决方案。
首先您需要创建一个如下所示的简单类。
.overhidden
{
overflow:hidden !important;
}
接下来,我们需要在您按下屏幕上的菜单图标时应用此类。如果他们再次点击关闭,我们也需要删除。在 jquery 中很容易做到,如下所示。
$(document).ready(function(){
$('#hamburger').click(function(){
$('body').toggleClass('overhidden');
});
});
关于javascript - 如何防止人们使用鼠标滚轮滚动按下我们的触摸拖动?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/24234990/