1

I have a web page with a JQuery tab containing an iframe.

When I scroll within that iframe (on long content, that continues off the visible page), the iframe scrolling briefly pauses 2-3 seconds near the bottom of the iframe, before completing the scroll (after activating the scrolling of the parent container).

By illustration, that behavior is similar to that shown in the "Same demo as above but without the trick" in this StackOverflow post,

https://stackoverflow.com/a/54202811/1904943

where when you scroll the section with the light blue background, the scrolling of that section pauses, then completes as the outer section activates.

How can I override this behavior, i.e. seamlessly complete the scrolling of the iframe content, regardless of the status of the parent container?

Victoria Stuart
  • 3,146
  • 2
  • 28
  • 26
  • ***Workaround:*** Since I am displaying HTML files within the iframe, I found that padding the bottom of those files with a bit of blank space alleviates the problem described in my question. That is, I am able to scroll to the bottom of the iframe (HTML) content and into that padding, before triggering the scrolling of the parent `
    `. CSS file addition: `html {padding-bottom: 10rem;}`
     – Victoria Stuart Feb 23 '21 at 00:19

0 Answers0