Scrolling stops on child iframes (videos from vimeo and youtube embeds)

[jonathancochran]

On both desktop and touch devices scrolling stops working when the mouse cursor (or touch point) is on an iframe. This is because the focus goes to the iframe. I've tried numerous ways to get around this by adding scrolling="no" and overflow: hidden to the iframe without success. Using css style="pointer-events: none" fixes the scrolling issue but then any mouse activity is also disabled on the iframe.

Environment

• Browser: Chrome / FF / Safari / Mobile devices
• Version of smooth-scrollbar: 8.3.1

Issue Summary

Iframe takes the focus making smooth scroll parent unresponsive / frozen.

Current Behavior

Mouse over iframe embed, smooth scroll stops working.

Expected Behavior

Scrolling should still function on the parent. A possible solution could be adding an attribute to the child iframe to indicate the scrolling should be ignored: <iframe data-scroll-disabled="true" ...> or maybe part of the scrollOptions when it's initialized.

Steps to Reproduce

1. Setup a container with smooth scroll
2. Embed a youtube or vimeo video
3. Attempt to scroll with your cursor over the video

Online demo

https://codepan.net/gist/654acec7bbbb3742a6fc5bc892315126

[idiotWu]

This is because events from iframe cannot be captured from the outer document. See #143

[Dushyant1295]

I have similar issue all we can do is to set pointer event : none
(but then we can't control the players controls we have to set video as autoplay on loop may be in some case ... )

iframe{
  pointer-events:none;
}