---
tags: Swiper
---
# Thumbs Gallery With Loop Mode Use Controller(略縮圖 循環)

**version 4.5.0**
**version 4.5.1** (當有循環時小圖沒有.active的問題就沒了)

galleryThumbs = 小圖
galleryTop = 大圖

- 有循環
- 例子是使用 ==Controller== 來執行 不是用 thumbs
- 大小圖、箭頭，不管是"點擊"還是"觸摸"都為同步
- 無法判斷當顯示的slides數量 > 實際slides數量時，對按鈕等組件自動進行隱藏

<iframe height="525" style="width: 100%;" scrolling="no" title="thumbs / controller / loop" src="https://codepen.io/aso3580/embed/GRjPeVv?height=525&theme-id=dark&default-tab=html,result" frameborder="no" loading="lazy" allowtransparency="true" allowfullscreen="true">
See the Pen <a href='https://codepen.io/aso3580/pen/GRjPeVv'>thumbs / controller / loop</a> by Luke.H
(<a href='https://codepen.io/aso3580'>@aso3580</a>) on <a href='https://codepen.io'>CodePen</a>.
</iframe>