Iframe scrolling iOS 8

iframe scroll overflow ios8
Adrian Mojica picture Adrian Mojica · Sep 25, 2014 · Viewed 82.5k times · Source

I have an iframe and i need it to have a scrolling overflow. it seems work out in desktop, i used a work around to make it work in iOS. it works on android and iOS now. however, iOS8 it fails.

    <html>
    <body>
    <style type="text/css">
      .scroll-container {
       overflow: scroll;
       -webkit-overflow-scrolling: touch;
      }
     #iframe_survey {
      height: 100%;
     }

    .scroll-container {
     height: 100%;
     width: 100%;
     overflow: scroll;
     }
   </style>

   <div class="scroll-container scroll-ios">
   <iframe id="iframe_survey" src="www.iframe.com" style="border:0px #FFFFFF none;" name="myiFrame" frameborder="0" marginheight="0px" marginwidth="0px" width="100%"></iframe>
   </div>
   </body>

Answer

Usman Khawaja picture Usman Khawaja · Oct 4, 2014

Use the code in this way

<div style="overflow:auto;-webkit-overflow-scrolling:touch">
    <iframe style="width:100%;height:600px" src="www.iframe.com"></iframe>
</div>

Related questions

IFRAMEs and the Safari on the iPad, how can the user scroll the content?

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 …

Read More
How do I Scroll parent page to top when child page is click within iframe?

When someone clicks on a link within an iframe (child page), how do I get the parent page to scroll to the top? The issue is the child page will remain in the same spot of the page, because the …

Read More
How do you scroll an iframe from within using jquery?

I'm using a shadowbox which generates an iframe to display product details on a page. Because the details page can be pretty long, the client would like a "More" button that scrolls the page down (apparently the scrollbar on the …

Read More