关于Swiper基础演示中，缩略图控制的一些问题！

水目

请路过大神帮忙调教！！！


按照基础演示中的做出来的效果如此

代码：


可是我要的并不是这个样子，我要的是如下的样式，请看：

代码修改如下：

如上图，大图和小图都希望做到自动滚动，所以给它们加了蓝色框的代码，同时小图第一个slide要靠左，所以移除了红色框的代码。
但是！滚动时出现了如下的错误！请看图片，
一：自行滚动时出错

二：点击小图，大图不切换
三：滑动大图时小图切换不准确，且active状态添加也不准。


请路过大神帮忙调教！！！

siyuexi

我也遇到这个问题，请问你解决了没？

wave

请问楼主解决了吗？

凉凉凉

刚刚解决了，直接用分页器写，不要用双向控制器了

1.     var galleryTop = new Swiper('.gallery-top', {
   
2.         nextButton: '.swiper-button-next',
   
3.         prevButton: '.swiper-button-prev',
   
4.         spaceBetween: 10,
   
5.         pagination: '.swiper-pagination',
   
6.         paginationClickable: true,
   
7.         paginationBulletRender: function (swiper, index, className) {
   
8.             return '<span style="background:url('+imageinfo[index].file_name+')" class="' + className + '"></span>';
   
9.         },
   
10.         onSlideChangeEnd: function(swiper){
    
11.             var index = swiper.activeIndex;
    
12.             $(".width_height").html(imageinfo[index].width_height);
    
13.             $(".resolution").html(imageinfo[index].resolution);
    
14.             $(".size").html(imageinfo[index].size);
    
15.             $(".color").html(imageinfo[index].color);
    
16.             $(".create_time").html(imageinfo[index].create_time);
    
17.             $(".format").html(imageinfo[index].format);
    
18.         }
    
19.     });

复制代码

龙龙龙

凉凉凉 发表于 2016-11-21 14:14
刚刚解决了，直接用分页器写，不要用双向控制器了

能不能发html+css看看啊

zhanglin

楼主你好，我复制了demo的缩略图代码到我的盒子里面，为什么显示不了，我把我的所有代码删掉就可以

gaozai

您好楼主 您能把html代码发一下吗 谢谢谢谢

ifyou

你好  我想问下   你是如何让分页器很多可以滚动的？  

web_小虾米

求一个demo

yanguoqiang29

同求一个DEMO，我的会出现缩略图显示不全的问题。
还有如果手动把缩略图那一行拖动一下，有很大几率造成顺序出错