I've been rebuilding my site to use Infinite Scroll in several sections. It uses a library called ScrollMagic, so when the user scrolls to the bottom of the page it loads an HTML fragment of the same page but with a query string variable via PHP that tells it where to start.
At the bottom of each fragment, I have an Adsense banner.
On my Android phone, this works perfect... the banner shows and I have a little animated circle beneath it for 1-2 seconds, waiting for the next section to load.
But I just learned that when I scroll down kind of fast on Safari on iPhone, the user gets to the banner and there's no animated circle or anything to let the user know that there's more to come. Then it just kind of... stays there. For like 30 seconds. I tried scrolling up, and it got halfway between an Adsense banner before it wouldn't scroll up any further.
If I scroll down slowly it doesn't do this, only when I scroll down kind of fast.
It's not an issue of multiple iterations being on the page and slowing things down, it happens on the first iteration.
My only guess is that it's waiting for the banner to completely load before moving on to the next part?
If anyone else has experienced this issue, what did you do to fix it? Or can you guys suggest anything I can do on an iPhone to track down the source of the problem?