[Swiper] 특정 슬라이드로 이동하기

이미지 썸네일 클릭 시 갤러리용 팝업이 뜬다.

갤러리용 팝업에 swiper가 들어있어서 썸네일에 맞는 이미지가 swiper에 떠야 한다.

pager를 클릭하도록 하고 싶었지만 최초 1회는 아직 pager가 로드되지 않는 상태라서

기능이 되지 않았다.

검색 해 보니 지원하고있는 method가 이미 있다.

 

        var slider = new Swiper($("#modal_detail [data-slider='type02']"), {
            slidesPerView: '1',
            centeredSlides: true,
            loop: true,
            loopAdditionalSlides: 1,
            grabCursor: true,
            observer: true,
            observeParents: true,
            effect: 'coverflow',       
            coverflowEffect: {
                rotate: 0,
                stretch: 0,
                depth: 199,
                modifier: 1,
                slideShadows : true,
            },
            navigation: {
                nextEl: $slider.find('.swiper-button-next'),
                prevEl: $slider.find('.swiper-button-prev'),
            },             
        });
        $('[data-js="modalDetail"]').on('click', function(){
            slider.slideTo($(this).data('slide')+1, 1000);
        });

 

참고: https://stackoverflow.com/questions/23922480/go-to-a-specific-slide-with-idangerous-swiper