자바스크립트 Swiper 슬라이더 - Swiper Slider Thumbs Gallery centerSlides

Swiper.js

 

See the Pen Swiper 슬라이드 - Thumbs Gallery centerSlides 적용 by kimyangsun (@kimyangsun) on CodePen.

 

자바스크립트 Swiper 슬라이더 - Swiper Slider Thumbs Gallery centerSlides 코드펜 예제입니다.

 

var galleryTop = new Swiper('.gallery-top', {
	spaceBetween: 10,
	navigation: {
		nextEl: '.swiper-button-next',
		prevEl: '.swiper-button-prev',
	},
	loop: true,
	loopedSlides: 3,
});
var galleryThumbs = new Swiper('.gallery-thumbs', {
	spaceBetween: 10,
	centeredSlides: true,
	slidesPerView: 3,
	touchRatio: 0.2,
	slideToClickedSlide: true,
	loop: true,
	loopedSlides: 3
});

galleryTop.controller.control = galleryThumbs;
galleryThumbs.controller.control = galleryTop;