当鼠标悬停在嵌入式 iframe 上时防止父页面滚动
Prevent parent page from scrolling when mouse is over embedded iframe
...不限制 iframe 内的滚动或需要专门命名可滚动元素。
我有一个类似于 google 的地图小部件，可以以 iframe 嵌入代码的形式嵌入到第 3 方网站中。当人们在我的小部件上使用鼠标滚轮时，我只想滚动小部件的内容而不是父页面。
我的问题类似于 How to prevent page scrolling when scrolling a DIV element? 但我的问题是我的 ifrmae 包含多个元素，包括媒体和 canvas 必须继续听鼠标滚轮事件。 TLDR 使用 e.preventDefault() 并手动更新 iframe 内所有元素的 scrollTop 属性 的解决方案保持可滚动是不切实际的，容易出错并且依赖于非标准 wheelDelta 属性.
Here is a JS Bin 为了您的方便。谢谢。
在 iframe 中滚动时，body 对那里发生的事情一无所知。但是当 iframe 滚动条到达底部或顶部时，它会将滚动传递给主体。
在那里查看我的 jsFiddle 和控制台日志。
...不限制 iframe 内的滚动或需要专门命名可滚动元素。
我有一个类似于 google 的地图小部件，可以以 iframe 嵌入代码的形式嵌入到第 3 方网站中。当人们在我的小部件上使用鼠标滚轮时，我只想滚动小部件的内容而不是父页面。
我的问题类似于 How to prevent page scrolling when scrolling a DIV element? 但我的问题是我的 ifrmae 包含多个元素，包括媒体和 canvas 必须继续听鼠标滚轮事件。 TLDR 使用 e.preventDefault() 并手动更新 iframe 内所有元素的 scrollTop 属性 的解决方案保持可滚动是不切实际的，容易出错并且依赖于非标准 wheelDelta 属性.
Here is a JS Bin 为了您的方便。谢谢。
在 iframe 中滚动时，body 对那里发生的事情一无所知。但是当 iframe 滚动条到达底部或顶部时，它会将滚动传递给主体。
在那里查看我的 jsFiddle 和控制台日志。