查看: 3453|回复: 2
打印 上一主题 下一主题

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

[复制链接]

该用户从未签到

1

主题

2

帖子

5

积分

新手上路

Rank: 1

积分
5
跳转到指定楼层
楼主
发表于 2018-4-16 21:07:51 | 只看该作者 回帖奖励 |倒序浏览 |阅读模式
使用嵌套swiper的方式,里边的swiper,不管是使用背景图还是img标签,都会导致这个swiper(里边的这个) next 和 prev这两个按钮 在swipe-slider 下边,左滑(手指松开)一次之后,就会出现,或者点击右边的按钮(虽然看不见,位置大致知道)也会出现,这个问题很严重!!!只会在ios中任何浏览器(包括微信)中出现,android和PC都正常
分享到:  QQ好友和群QQ好友和群 QQ空间QQ空间 腾讯微博腾讯微博 腾讯朋友腾讯朋友
收藏收藏 分享分享 分享淘帖
回复

使用道具 举报

该用户从未签到

1

主题

2

帖子

5

积分

新手上路

Rank: 1

积分
5
沙发
 楼主| 发表于 2018-4-16 23:43:26 | 只看该作者
查阅了无数的资料,终于找到解决办法了
产生问题的原因:由于切换方式使用的是translate3d, Safari 3D transform变换z-index层级渲染异常,具体可查阅这篇文章,但这里所说的解决办法并不适用于这里,最终找到一个完美的解决办法,具体可看这篇文章
解决办法如下:添加在CSS中
*:not(html){
    -webkit-transform: translate3d(0,0,0);
}
回复 支持 反对

使用道具 举报

该用户从未签到

0

主题

2

帖子

11

积分

新手上路

Rank: 1

积分
11
板凳
发表于 2020-10-9 09:47:15 | 只看该作者
确实是坑。页面有多个swiper嵌套,引用vue拿的数据,在一个滚动长页面里的轮播自定义按钮会被图挡住,过3秒会显示出来。发现只有ios是这样,没头绪找了1天,才想到是ios的某个原因导致层级失效,看了张旭东的文章明白了。感谢
回复 支持 反对

使用道具 举报

您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

Archiver|手机版|小黑屋|Swiper中文网 ( 粤ICP备15001020号

GMT+8, 2024-11-23 21:28 , Processed in 0.066554 second(s), 27 queries .

Powered by Discuz! X3.2

© 2001-2013 Comsenz Inc.

快速回复 返回顶部 返回列表