Element is disappeared on safari in iPhone- iOS 12

637 views Asked by At

I've developed a swiper (using the library of react swiper (http://kidjp85.github.io/react-id-swiper/) and unfortunately, the swiper is disappeared on the browsers of Safari and Chrome in iPhone devices - only iOS 12+. Just when i'm clicking on it, the swiper is shown. You can see the problem when surfing this site through an iPhone device running ios 12 and above, the bug does not occur in iPhone devices running iOS below 12.

This is a demo site where you can see the bug. Surf from iPhone with iOS 12 to this site to see it.

http://qmerce.github.io/static-testing-site/articles/strip_stage/

Thank you

1

There are 1 answers

0
Mehdi Shakeri On

Use of translate3d pushes CSS animations into hardware acceleration:

-webkit-transform: translate3d(0,0,0);
transform: translate3d(0,0,0);

on every swiper-slide element