Предотвращение прокрутки родительской страницы при переходе мыши по встроенному iframe

Question

... без ограничения прокрутки внутри iframe или необходимости конкретно указывать прокручиваемые элементы.

У меня есть вид, похожий на google-map-like, который может быть встроен в сторонние сайты в виде кода вставки iframe. Когда люди используют колесико мыши над моим виджетами, я хочу прокручивать содержимое виджета, а не родительскую страницу.

Мой вопрос похож на How to prevent page scrolling when scrolling a DIV element?, но моя проблема в том, что my ifrmae содержит несколько элементов, включая носители и холсты, которые должны продолжать слушать событие колеса мыши. TLDR решения использовать e.preventDefault() и вручную обновить scrollTop свойства всех элементов внутри фрейма, которые должны остаться прокручивать непрактично, подвержены ошибкам, и зависят от нестандартного wheelDelta собственности.

Here is a JS Bin для вашего удобства. Спасибо.

Answer 1

При прокрутке внутри iframebody ничего не знает о том, что там происходит. Но когда скроллер iframe достигает нижней или верхней части, он проходит прокрутку на тело. См. Мой jsFiddle и журнал консоли.