swiper4.5因为display:none再次显示无法自动滑动问题解决方案
作者:超级管理员
时间:2023-04-26
浏览:114
点赞:10
问题是这样的: 当你兴高采烈的写完一个tab,并且把swiper嵌入到每一个tab item 觉得大功告成的时候,你会发现,永远只有第一个tab上的swiper生效了,其余的不管你怎么切换,swiper总是初始化失败,是的,就是不能愉快的滚动了~
解决方法
官网给出的解决方案是,使用observer: swiper4的api地址: https://www.swiper.com.cn/api/observer/218.html
observer:true,//修改swiper自己或子元素时,自动初始化swiperobserveParents:true,//修改swiper的父元素时,自动初始化swiper
案例:
<script language="JavaScript"> var mySwiper = new Swiper('.swiper-container',{ pagination: { el: '.swiper-pagination', }, observer:true, }) $('#btn1').click(function(){ $(".swiper-wrapper .swiper-slide1").remove(); })</script>
也可以再试试mySwiper.init(),重新初始化的方式。
此方法,可以解决因display:none,导致的swiper无法初始化的问,但是无法解决无法自动播放的我问题。
文章标题:swiper4.5因为display:none再次显示无法自动滑动问题解决方案
pboot建站网 (hhsy.cc) 所发布的内容,部分为原创文章,
转载请注明来源,网络转载文章如有侵权请联系我们!
本文最后更新发布于
某些文章具有时效性,若有错误或已失效,请留言或联系客服:hsy_99999999@163.com
pboot建站网 (hhsy.cc) 所发布的内容,部分为原创文章,
转载请注明来源,网络转载文章如有侵权请联系我们!
本文最后更新发布于
2023-04-26
,
某些文章具有时效性,若有错误或已失效,请留言或联系客服:hsy_99999999@163.com