美文网首页
【web前端】ios上使用swiper 在自动翻页时出现白色闪屏

【web前端】ios上使用swiper 在自动翻页时出现白色闪屏

作者: 林哥学前端 | 来源:发表于2020-09-03 15:01 被阅读0次

    在ios上,如果有一个宽度100%的swiper,在自动向右翻页时,后面一页的左边会闪一块白色
    经过多次各种试验,我发现了这个问题的原因
    应该是ios判断后面一页这个dom没有在屏幕上显示,所以没有渲染它,等到滚动到屏幕内时候开始渲染,所以出现的短暂的白屏。
    发现这个原因后,我让每个swiper-slide左边多出来一块padding,这样在显示当前的swiper-slide时,也有一小块下一页的swiper-slide在屏幕中,所以系统就会去渲染这个dom
    就是加上如下的css

    .swiper-slide{
      box-sizing: content-box;
      padding-left: 10px;
      margin-left: -10px;
    }
    

    相关文章

      网友评论

          本文标题:【web前端】ios上使用swiper 在自动翻页时出现白色闪屏

          本文链接:https://www.haomeiwen.com/subject/urtosktx.html