Ion-content in ion-slides can have both X and Y shift in IOS

I have been using ion-slides component (from swiper.js) to implement a multi-page horizontal slide box, each page of which can be scrolled vertically, by using ion-content.

On web and android, it works well. On IOS, however, when i try to change slide or scroll vertically, the slide box can have 2-dimensional shift, as shown in the two pictures below. It can also get stuck between two pages, if I tried to scroll both pages during the transition.

I have created a CodePen example, which shows how my code works. As I mentioned, on web, it works fine. You have to install on IOS to reproduce this behavior.
hundreds of pages in a 3-page swiper implementation