[英]How to make swiper.js slider (Thumbs Gallery) display as block instead of inline
[英]Swiper, cannot make gallery thumbs move how to fix?
點擊拇指圖片根據需要顯示,但拇指本身不移動,我的拇指比顯示的多,當我點擊拇指時,她必須像點擊下一個按鈕一樣移動**
let galleryThumbs = new Swiper('.gallery-thumbs', {
spaceBetween: 10,
slidesPerView: 2,
loop: true,
freeMode: false,
watchSlidesVisibility: true,
watchSlidesProgress: true,
slideToClickedSlide: true,
loopedSlides: 5
});
let galleryTop = new Swiper('.gallery-top', {
spaceBetween: 10,
loopedSlides: 5,
loop:true,
thumbs: {
swiper: galleryThumbs,
},
});
這是我的 html(它呈現簡單的 swiper-slide)
<div class="swiper-container gallery-top">
<div class="swiper-wrapper">
[[getImageList?
&docid=`[[*id]]`
&limit=`0`
&tvname=`img-slider`
&tpl=`@CODE: <div class="swiper-slide"><img src="/[[+home_img]]" alt="[[*pagetitle]]"></div>`
]]
</div>
</div>
<div class='swiper-container gallery-thumbs'>
<div class="swiper-wrapper">
[[getImageList?
&docid=`[[*id]]`
&limit=`0`
&tvname=`img-slider`
&tpl=`@CODE: <div class="swiper-slide"><div class="small_body"><img src="/[[+home_img]]" alt="[[*pagetitle]]"></div></div>`
]]
</div>
</div>
簡單的兄弟_)) 將此行添加到您的代碼中並使其移動! galleryTop.controller.control = galleryThumbs;
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.