CSS HTML 内容仅使用滚动条滚动,而不使用鼠标滚轮

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/10449802/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-08-30 03:46:47  来源:igfitidea点击:

HTML content only scrolls with scrollbar, not mouse wheel

cssscrolloverflowmouseeventmousewheel

提问by daGUY

I have a <div>on my page with a fixed height, and overflow-y: scroll;set so that the content will scroll when it passes the bottom edge of the <div>. Nothing out of the ordinary.

我有<div>我的网页上有一个固定的高度,并overflow-y: scroll;设定这样,当它经过的底部边缘的内容将滚动<div>。没有什么异常。

For some bizarre reason, the mouse wheel will only scroll the content if the cursor is over empty spacein the <div>or if it's over the scrollbar itself. If the cursor happens to be over any of the text content in the <div>, the mouse wheel won't do anything.

对于一些奇怪的原因,鼠标滚轮将只有当光标位于滚动内容空白<div>或者如果它是在滚动条本身。如果光标恰好位于 中的任何文本内容上<div>,鼠标滚轮将不会执行任何操作。

This happens in both Firefox and Chrome, so it isn't just a quirk of a particular rendering engine or something.

这发生在 Firefox 和 Chrome 中,所以它不仅仅是特定渲染引擎或其他东西的怪癖。

The <div>in question is overlaid on top of another via position: absolute;, so I'm assuming that somehow the <div>behind it is interfering with the mouse wheel event - but then you'd think the problem would be reversed (the <div>would scroll whenthe cursor was over the text, not over the empty space).

<div>问题是覆盖在另一个中通过顶部position: absolute;,所以我假设在某种程度上<div>它背后与鼠标滚轮事件干扰-但是你会觉得这个问题将反转(在<div>将滚动光标是在文本,而不是在空白处)。

Anyone else ever see anything like this before? I'm stumped!

其他人以前见过这样的事情吗?我难住了!

采纳答案by daGUY

Got it - it's because I was using the FancyBox mousewheel plugin. This causes FancyBox to capture all mousewheel events (for use with scrolling through galleries). Since I'm not actually using any galleries, I have no need for it, so I took it out and immediately that fixed my problem.

明白了 - 这是因为我使用了 FancyBox mousewheel插件。这会导致 FancyBox 捕获所有鼠标滚轮事件(用于滚动画廊)。因为我实际上没有使用任何画廊,所以我不需要它,所以我把它拿出来并立即解决了我的问题。