Announcement: Update to iOS 12

Enjoy a faster and more responsive experience as well as fun new features, like Memoji and Camera Effects.
Get iOS 12 > https://support.apple.com/ios/update

Looks like no one’s replied in a while. To start the conversation again, simply ask a new question.

Question:

Question: Still no way to scroll iframes?

Hi,

I need to embed a WordPress blog into my website

But the iPad, which is the target doesn't allow scrolling within the blog, since it's an iFrame or object.

No, two fingers or one finger doesn't scroll the content within an iFrame or object placeholder.


C'mon, why the **** is this impossible?
Anyone with any luck in embeding WordPress into an iFrame that works on the iPad.


Adding a div with

-webkit-overflow-scrolling:touch andoverflow:scroll or auto

doesn't help.


The wordpress address is in the same domain as the page wanting to embed it.

Using iScroll 4 doesn't help.

WPTouch Pro doesn't help.


I can't believe that there is no way to do this. Otherwise it admitting that the iPad can't be

a professional tool.


Any clue?

iPad, iOS 5.0.1

Posted on

Reply

Page content loaded

Feb 21, 2012 2:48 AM in response to sjordi In response to sjordi

Hi


First of all, we're just fellow users here so even if you are annoyed, we aren't responsible for that...


Second, you say that you "need". Are you sure you really need to embed it? I create websites for a living and the case where you need to embed a page in another is really really rare.


Third, have you tried looking at the HTML 5 attributes of the iframe?


Fourth, I have tried to create an iframe for testing purpose, to try solutions shown on the Internet. Personally I never have to scroll. The iPad modifies the height of the frame so that it can display the entire page. Do you have the same thing? Is that the problem?

Feb 21, 2012 2:48 AM

Reply Helpful

Feb 21, 2012 5:00 AM in response to iamjeremie In response to iamjeremie

Hi Jeremie,


1- I know you're not responsible in the forums.

Just asking the community facing the same problem


2- Yes I need to embed it. Because the website is entirely autonomous and not designed in WordPress. There is one page embeding a blog, which is written in WordPress, the only tool that the customer knows how to use.

The WordPress blog is stipped down to the blog content itself, without any decorations, headers, footers, etc. I just need to encapsulate the blog contente into the web page.


3- Yes, iframe attributes are ignored by iOS 5 supposedly to sandbox the outside website, for security reasons. It's supposed to work if the iframe points to the same domain, which is the case here.

Even if you replace the iframe by an "<object data="...>" it behaves the same way.


4- yes I tried. No matter what external tools trying to find a workaround I us, whatever ui-kit variable you add, it's impossible to scroll within the iframe. Or when it is possible, then the iframe scrolls but the content doesn't update.

I'm not the only one with that problem.


Thanks anyway.

Feb 21, 2012 5:00 AM

Reply Helpful

Apr 23, 2012 8:27 AM in response to sjordi In response to sjordi

This is a signficant issue for everyone using Google Docs as the source for data arriving on a webpage, where the data exceeds the screensize, and therefore scrolling is required.


The only mechanism Google provides for linking a Docs to a webpage is via iframe.


We have large spreadsheets feeding into our historical research site and now these cannot be scrolled at all


http://aircrewremembrancesociety.com/Kracker/LuftwaffeGermanPilotsE.html


Previously this worked just fine on iPhone and iPad but now with iOS5, 2 finger scrolling - or indeed any finger scrolling - has broken.


(I also note that on iPhone the <divs> used to generate the header are not now working correctly, but that's another issue I can hopefully figure out).


We chose to use Google Docs as we have researchers all over the world and we need to have a mechanism whereby all can input their data and have it go live without the intervention of a webmaster.

Apr 23, 2012 8:27 AM

Reply Helpful

Sep 26, 2012 10:22 PM in response to steftheref In response to steftheref

User csdco (https://github.com/fancyapps/fancyBox/issues/2#issuecomment-5997068) has provided a simple answer that solved the issue for me.



-----------------------------------

It's much easier to control overflowed divs than it is iframes, and the scrolling + blank content issues are working all the way back to iOS 4, where previously I wasn't even able to get the 2 finger scrolling to work (in iframes).



It goes something like this:

<iframe id="stupid-iframe" width="600" height="200" src="a-file.html"></iframe>



a-file.html:

<html>

<body>

<div id="wrapper" style="width: 100%; height: 100%; overflow: auto; -webkit-overflow-scrolling: touch;">

...

</div>

</body>

</html>

Sep 26, 2012 10:22 PM

Reply Helpful
User profile for user: sjordi

Question: Still no way to scroll iframes?