多个柔性滑块移除当前滑块

时间:2013-02-14 01:21:19

标签: jquery flexslider

我正在尝试从具有多个滑块的页面上的flexslider中删除当前幻灯片,这些滑块当前共享同一个类。 http://flexslider.woothemes.com/

它目前的作用是如果我点击关闭链接以移除第二个flexslider上的当前幻灯片,它将从第一个flexslider中删除当前幻灯片。

我需要它才能正确删除相应滑块上的当前幻灯片。有什么想法吗?

HTML

<!-- 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>

脚本

(window).load(function() {

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

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

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

1 个答案:

答案 0 :(得分:0)

管理找到一个变通方法,currentSlide只返回幻灯片索引号。所以它需要更具体的选择器。

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