解决swiper默认显示最后一张问题

swiper默认显示最后一张?

在使用swiper轮播图的时候,用ajax动态加载swiper-slide,每次刷新默认会显示到最后一张,设置参数如下

$(document).ready(function(){
     
    var galleryThumbs = new Swiper('.gallery-thumbs', {
     
       slidesPerView: 1.5,
       spaceBetween: 15,
       freeMode: false,
       observer:true,
       observeParents:true,
       slideToClickedSlide: true,
      //  effect : 'coverflow',
       freeModeSticky:true,
       initialSlide:2
    });
    var galleryTop = new Swiper('.gallery-top', {
     
      spaceBetween: 15,
      thumbs: {
     
        swiper: galleryThumbs
      }
    }); 
  })     ```


原因:使用template生成轮播图,默认是加载的空数组
 
### 使用定时器解决这个问题,操作DOM更改了transform3d初始值,代码如下
 


setTimeout(() => {
     $('#swiper_thumbs').css("transform","translate3d(0,0,0)")}, 50)


 

你可能感兴趣的:(JS,前端学习)