Problem with Scroll in iOS 10.2 (Auto scrolling TOP not intentional)

Ionic Framework ionic-v3
1

I’m trying to just open a website in a webview (iframe), when i’m scrolling the page, it automatically goes top, i dont know why.

<style type="text/css">
  .scroll-container {
height: 100%;
width: 100%;
overflow: scroll;
-webkit-overflow-scrolling: touch;
overflow-y: scroll !important;
  }
</style>

<div class="scroll-container scroll-ios">
  <iframe data-tap-disabled="true" src="http://www.site.com" marginheight="0px" marginwidth="0px" frameborder=0 width="100%" height="100%"></iframe>
</div>
2

A video showing the problem in iPhone 7 - iOS 10.2

3

It’s best NOT to load a website in your app.

  1. Apple will reject it. They’re very big about an app being it’s own thing. If you just need a mobile site, make a mobile web site.

  2. Using an iframe: Dont do it. Iframes are a can of worms that can lead to issues down the road. Pretty much what you’re seeing.

you best case, is to use an In-App-Browser plugin instead.

4

@fsarmento Did you manage to solve this? I’m experiencing the same issue with ionic 4 and iOS 12.2 and it’s driving me crazy.

@mhartington There are rare use cases when you just need to use an iframe. E.g. I’m combining an existing shop with an EAN Barcode Scanner. No need to reimplement the shop but shopping still works. And “fast” shopping also works thanks to the scanner.

1 Like