问题
...without limiting the scroll inside the iframe or the need to specifically name the scrollable elements.
I have a google-map-like widget that can be embedded in 3rd party websites in the form of an iframe embed code. When people use mouse wheel over my widget I want only the content of the widget to scroll and not the parent page.
My question is similar to How to prevent page scrolling when scrolling a DIV element? but my problem is that my ifrmae contains multiple elements including media and canvas that must keep listening to mouse wheel event. TLDR the solution to use e.preventDefault() and manually update the scrollTop property of all elements inside the iframe that should stay scrollable is impractical, error prone and dependent on the non-standard wheelDelta property.
Here is a JS Bin for your convenience. Thank you.
回答1:
While scrolling inside an iframe, the body doesn't know anything about what happens there. But when iframe scroller reach the bottom or the top, it pass scrolling to body.
See my jsFiddle and console log there.
来源：https://stackoverflow.com/questions/30486787/prevent-parent-page-from-scrolling-when-mouse-is-over-embedded-iframe