Infinite scroll without infecting element

I try to implement an infinite scroll as a marquee with a defined post limit.

A basic infinite scroll is made by injecting new pages to the end of the scrollable section when you reach the end of the scroll section.

My layout is quite like a marquee but scrollable, as the content is always the same I do not wanted to inject new element.

You can check the behavior here: http://jensingvarsson.studio-push.com

This is the behavior I want, what I've done is duplicate the content of the scroll section in order to have two layout in the scroll section. Then, on scroll, you track the 1/4 and the 3/4 position in the scroll section and jump to the other side. It gives the effect of infinite scroll where you just jump in the scroll section from one side to another.

It display exactly the same but without adding new element at the end.

This behavior works like a charm in every device and browser EXCEPT iOs. iOs seems to optimize the GPU by hiding the elements that is not in the bounds of the screen so when I jump from 3/4 of the scroll to 1/4. It blinks to a white element and show finally the 1/4 scroll.

Here is a schema of the scroll

scroll start post limit   first elem  first elem clone
                      |   |           |
                      v   v           v
                      [1111111-22222222]
                          ^         ^
                          |         |
                          -----------
when you reach one of those points it goes to the other one to make an effect of infinite

Is there a way to get rid of this blink?