2

I have a page being accessed on an external site via an iframe. Some of my JS functions require instantly scrolling to the top of the page, which works fine in a desktop browser. But in a browser on iOS, when my page attempts to scroll to the top of itself while inside the iframe, it just won't work.

I’ve tried everything I can think of: scrollTop = 0, x.scrollTo(0,0), as well as jQuery’s animate({ scrollTop: 0 }) and scrollTop(). All of these were attempted with a wide variety of selectors (an applicable div, window, body, html, document, parent.document, etc).

The answer in this thread also seems to be outdated in newer versions of iOS.

Any help or suggestions to get this running would be appreciated!

Community
  • 1
  • 1
MDT
  • 21
  • 4

1 Answers1

0

There's an app a css property for that:

/* select it here */ {
    overflow: scroll;
}

Of course, you can can also contact the external site in question and ask them to add this:

<script>
window.onmessage=function(x) { window.scrollTo((a=JSON.parse(x.data))[0], a[1]); }
</script>

This way, it can be done like so:

x.postMessage('[0,0]', '*');
Nissa
  • 4,636
  • 8
  • 29
  • 37
  • Hi, thanks for the input! Unfortunately, `overflow: scroll` had no affect on my ability to jump to the top of the page. Also, your messaging solution scrolls to the top of the external parent page, but I’m trying to scroll to the top of the page within the iframe. I’ve updated my post for further clarity. Are there any other suggestions you have for this situation? Thanks again! – MDT May 27 '16 at 01:44
  • Unfortunately, no. I've tried it before I came here and I usually use mobile, and those are my only ideas. – Nissa May 27 '16 at 01:54
  • same problem to me :( – Duy Trần Aug 24 '18 at 04:31