According to the Apple iOS mantra it should be possible to scroll the contents of an IFRAME by dragging it with two fingers. Unfortunately running the latest version of iOS on the iPad I have yet to find a single website with an IFRAME that scrolls using this method - no scrollbars appear either.
Does anyone know how a user is supposed to scroll the contents of an IFRAME with the mobile Safari?
Scroll a webpage: Drag up, down, or sideways. Scroll within a frame: Drag two fingers inside the frame.
Use a two finger press inside the window that you're trying to scroll and move them up or down simultaneously. Or pinch your thumb and forefinger together and move it up or down.
To scroll an iframe with JavaScript, we can use the scrollTo method. const myIframe = document. getElementById("iframe"); myIframe. onload = () => { myIframe.
If the iframe content is fully responsive and can resize itself without internal scroll bars, then iOS Safari will resize the iframe without any real issues. Then this works without issues in iOS 7.1 Safari. You can change between landscape and portrait without any issues.
iOS 5 added the following style that can be added to the parent div so that scrolling works.
-webkit-overflow-scrolling:touch
-webkit-overflow-scrolling:touch
as mentioned in the answer is infact the possible solution.
<div style="overflow:scroll !important; -webkit-overflow-scrolling:touch !important;"> <iframe src="YOUR_PAGE_URL" width="600" height="400"></iframe> </div>
But if you are unable to scroll up and down inside the iframe as shown in image below,
you could try scrolling with 2 fingers diagonally like this,
This actually worked in my case, so just sharing it if you haven't still found a solution for this.
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