[jquery] swiper 3개 연동하기, 사진 갤러리 만들기, 썸네일, 크게 보기

이번에 신규 페이지를 제작하며 갤러리를 만들어야 했는데, 다양한 라이브러리를 찾아보다가 기존에 자주 사용하던 swiper를 이용하여 갤러리를 구성할 수 있다는 걸 깨달았다. 먼저 예시를 보자면 다음과 같다. ( 예제 화면이 작게 보인다면 아래쪽 0.5x 클릭하여 확인하기 ) See the Pen swiper 3개 연동하기, thumbnail swiper and layer popup by Gia (@gia-world) on CodePen. 구성은 3개의 슬라이더로 되어있다. 메인 사진 슬라이더, 썸네일 슬라이더, 레이어 팝업 슬라이더. 메인 슬라이더를 넘기면 썸네일도 함께 넘어가고, 썸네일 슬라이더를 넘기면 메인도 같이 돌아간다. 또한 메인 사진을 클릭하여 팝업을 띄울 경우에도 메인 슬라이더와 연동이 되어..

2022.04.22