多个swiper间切换，隐藏后再显示不会触发自动播放

Nola_jun · 发表于 2016-6-6 16:37:50

kongxiaonan 发表于 2016-5-19 13:59
$(document).ready(function() {
var swiper = new Swiper('#swiper-container1', {
pagination: ...

我这个是后台循环出来的，只有一个swiper-container，做替换，问题是再次点击回之前的swiper，不自动滑动，变成需要先手动触发一下，才可以

Nola_jun · 发表于 2016-6-6 16:38:28

kongxiaonan 发表于 2016-5-19 14:01
代码如上就是切换的时候切换到第二个的时候第二个里面的swiper就不自动轮播了需要手动划一下才会开始 ...

是的，我的就是这个问题，怎么解决呢

忍V殇 · 发表于 2017-3-16 10:25:50

兄弟，你解决了吗？我现在遇到了，怎么破

fxy · 发表于 2017-9-22 23:35:06

我也遇到这个问题，怎么解决的

Toby · 发表于 2017-10-5 10:18:36

楼主的解决办法是什么？

Toby · 发表于 2017-10-5 10:25:45

之前解决了的兄弟能不能帮忙把这个问题破一下

Toby · 发表于 2017-10-5 11:04:37

多组swiper之间的切换，用显示隐藏不自动播放的问题确实很棘手，不过可以用控制高度的方法解决，把隐藏的swiper高度设为0，overflow：hidden。需要显示的swiper高度auto;用这种方法，每个swiper是同时运转的。只找到这个办法，希望能有更好的办法

团子先生 · 发表于 2017-11-13 16:10:58

在一个页面多个swiper切换，因为你只在页面加载的时候初始化了一次，所以切换的时候会停止轮播；解决方法：

切换的时候初始化

发飙的奶牛 · 发表于 2018-3-1 16:58:09

楼主有没有解决呢？同样的问题

funkhh · 发表于 2018-4-13 10:42:45

发飙的奶牛发表于 2018-3-1 16:58
楼主有没有解决呢？同样的问题

用swiper 销毁，mySwiper.destroy(false);切换回来后在初始化
this.mySwiper.destroy(false);
this.mySwiper=new Swiper(".content_header",{
autoplay:{disableOnInteraction:false},
speed:200,
loop:true,
observer:true,//修改swiper自己或子元素时，自动初始化swiper
observeParents:true,//修改swiper的父元素时，自动初始化swiper
pagination:{
el:'.swiper-pagination',
clickable:true
}
});