여러 플렉스 슬 라이더가 현재 슬라이드를 제거합니다.

Question

현재 동일한 클래스를 공유하는 여러 슬라이더가있는 페이지의 플렉스 슬라이더에서 현재 슬라이드를 제거하려고합니다. http://flexslider.woothemes.com/

현재 제 2 플렉스 슬라이더의 현재 슬라이드를 닫기 링크를 클릭하면 제 1 플렉스 슬라이더에서 현재 슬라이드가 제거됩니다.

각 슬라이더에서 현재 슬라이드를 올바르게 제거해야합니다. 어떤 아이디어?

HTML

(window).load(function() { 

    $('.choices').flexslider({ 
     animation: "slide", 
    }); 

    var slider = $('.choices').data('flexslider'); 

    $('.slides .close').click(function(){ 
     slider.removeSlide(slider.currentSlide); 
    }); 
}); 

Answer 1

이 해결 방법을 발견하는 관리

<!-- flexslider 1 --> 
<section class='choices'> 
    <ul class='slides'> 
    <li class='flex-active-slide'> 
     <a class='close'></a> 
     content here 
    </li> 
    <li> 
     <a class='close'></a> 
     content here 
    </li>   
    <li> 
     <a class='close'></a> 
     content here 
    </li> 
    </ul> 
</section> 

<!-- flexslider 2 --> 
<section class='choices'> 
    <ul class='slides'> 
    <li class='flex-active-slide'> 
     <a class='close'></a> 
     content here 
    </li> 
    <li> 
     <a class='close'></a> 
     content here 
    </li> 
    </ul> 
</section> 

스크립트의 currentSlide은 슬라이드 인덱스 번호를 반환합니다. 따라서 더 구체적인 선택기가 필요합니다.

$('.choices .close').click(function(){ 
    var sliderid = $(this).closest(".choices"); 
    var slider = sliderid.data('flexslider'); 
    slider.removeSlide(slider.currentSlide); 
});