SOLVED-Strange Infinite-scroll problem, tester wanted

I have a strange problem when it comes to infinite - scrolling.
The page is here https://www.manmade.se/dumpen/

I first load 100 items when the page loads the first time, then I load another 75 items when the page reach the bottom.

On my computer it works as it should, it loads new items when I scroll to the bottom of the page, and it loads the correct items as well. If you look at the console when you have loaded new items it says that there is 175 as it should. And if you do it ones more, than it is 224(the total number of items in the db).

You can also see on the yellow images that the headline is “ANNONS 175”,“ANNONS 185”,“ANNONS 195”,“ANNONS 205” and “ANNONS 215” on the last yellow one. All this is correct on the computer (Mac with Safari, Chrome or Firefox)

But if I do the same on my iPhone 6s it first load the first 100 items correctly (the last yellow image is “ANNONS 95”, but when I scroll down and load new items it loads the next 75 item twice !!
And this is the problem!

So the first yellow image after you have loaded new items are “ANNONS 105” and then if you look after “ANNONS 175”, you will see that it has loaded the same items again a second time.

So why has it loaded the 75 item twice on the phone but only one time on the computer?

And if I then try to load the last items, the ones from 175 to 224, it is not loading any more items at all.

So if anybody could please test this on an iPhone I would appreciate it a lot, just to see if it loads the last yellow image “ANNONS 215” for you, or if you get the same problem, that it loads the items from 100 to 175 twice for you as well.

Thanks a lot.

SOLVED - As soon as you write a question, you figure it out haha.

Inside the below you have the settimeout, and I had set it to 200, but as soon as I set it to 1000 it started to work. Nothing under a 1000 worked.

$$('.infinite-scroll-content').on('infinite', function () {
  // Exit, if loading in progress
  if (!allowInfinite) return;

  // Set loading flag
  allowInfinite = false;

  // Emulate 1s loading
  setTimeout(function () {
 more code....
}, 1000);
});
3 Likes