There are 2 synchronized slider slider. By clicking on the "close-btn" button of the first slide in the main slider, I would like to remove the same slide number from the auxiliary slider. I can not change the layout. Each slide has a unique data-slick-index, but I don’t have enough knowledge to get close to it. In js badly understand. Can anyone come across such a problem. Here is the link to the plugin http://kenwheeler.imtqy.com/slick/

$(document).ready(function () { $('.mainSlider').slick({ asNavFor: '.forSlider' }); $('.forSlider').slick({ asNavFor: '.mainSlider' }); }); 
 <div class="mainSlider"> <div class="slide1"> <div class="close-btn"></div> </div> ... <div class="slide10"></div> </div> <div class="forSlider"> <div class="slide1"></div> ... <div class="slide10"></div> </div>

  • Give the code to remove the slide for the first slider. - Stepan Kasyanenko

1 answer 1

I tried through index (), but obviously it does not work:

 $(document).ready(function () { $('.compare-goods-list-close-btn').on('click', function() { var indexOfcard = $(this).index('.compare-goods-list-close-btn'); $('.compare-goods-list').slick('slickRemove', $('.slick- slide').index(indexOfcard)); $('.compare-goods-fix__list').slick('slickRemove', $('.slick-slide').index(indexOfcard)); }) }); });