swiper 不管是哪个版本，在IOS中有一个很严重的BUG

qq625499770 · 发表于 2018-4-16 21:07:51

使用嵌套swiper的方式，里边的swiper，不管是使用背景图还是img标签，都会导致这个swiper(里边的这个) next 和 prev这两个按钮在swipe-slider 下边，左滑（手指松开）一次之后，就会出现，或者点击右边的按钮（虽然看不见，位置大致知道）也会出现，这个问题很严重！！！只会在ios中任何浏览器（包括微信）中出现，android和PC都正常

qq625499770 · 发表于 2018-4-16 23:43:26

查阅了无数的资料，终于找到解决办法了
产生问题的原因：由于切换方式使用的是translate3d， Safari 3D transform变换z-index层级渲染异常，具体可查阅这篇文章，但这里所说的解决办法并不适用于这里，最终找到一个完美的解决办法，具体可看这篇文章
解决办法如下：添加在CSS中
*:not(html){
-webkit-transform: translate3d(0,0,0);
}

hj250615 · 发表于 2020-10-9 09:47:15

确实是坑。页面有多个swiper嵌套，引用vue拿的数据，在一个滚动长页面里的轮播自定义按钮会被图挡住，过3秒会显示出来。发现只有ios是这样，没头绪找了1天，才想到是ios的某个原因导致层级失效，看了张旭东的文章明白了。感谢