I have an element inside of a page with scollbars, which is brought into view on page load via JS call to element.scrollIntoView()
- and this works fine, as expected.
Now, if I place this page into an IFRAME, the call to element.scrollIntoView()
not only brings element inside of iframe to the top of iframe - if the parent page has scrollbars of its own - it scroll the parent page as well to bring the element in question to the top of parent page as well.
I understand this is probably behavior by design, but is there a way to contain "scrollIntoView" behavior to the IFRAME only, or are there any alternatives to have this behavior (without affecting the parent page).
To scroll an iframe with JavaScript, we can use the scrollTo method. const myIframe = document. getElementById("iframe"); myIframe. onload = () => { myIframe.
The scrollIntoView() method scrolls an element into the visible area of the browser window.
Figured it out. I can set element's parent's scrollTop
to element's own offsetTop
. This will make parent scroll to element's position and effect will be local to IFRAME.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With