Переключение адреса в атрибуте src при переключении slick слайдов?

Question

[furcifer]

Добрый вечер!
Такой вопрос.
Есть слик слайдер, при переключении слайдов должны меняться адреса в src картинок в другом блоке.
У слайда появляется класс active у картинок в блоке меняется часть адреса.
Например "img/ch/1/alcantara/border/b1-1.png" - при одном активном слайде, "img/ch/22/alcantara/border/b1-1.png" при следующем.
имеется код который работает при клике на кнопку, как его изменить, чтобы все заработало?

const links = document.querySelectorAll('.link');

document.querySelector('.wrapper').onclick = event => {
  const btn = event.target.closest('button');
  
  if (btn) {
  	[...links].forEach(link => {
    	const text = link.getAttribute('src').split('/');
      text[text.length - 1 - +btn.parentNode.dataset.value] = btn.className;

      link.src = text.join('/');
      console.log(link.src);
    })
  }
}

..........
Подскажите пожалуйста!
https://jsfiddle.net/qhfkw065/32/
ссылка на предыдущий пост https://toster.ru/answer?answer_id=1275180#comment...

Answer 1

[Владимир Проскурин]

Чтобы все корректно работало, вы должны не следить за кликом по блоку, а слушать событие slick slider, благо они у него есть kenwheeler.github.io/slick (в самом низу блок events). Там есть удобное событие afterChange, которое принимает 3 аргумента, это ссылка на слайдер, номер текущего слайда и номер следующего.

$('.your-element').on('afterChange', function(event, slick, currentSlide, nextSlide){
  // тут производим смену картинки
});

Comments

[furcifer]

Владимир Проскурин извините, не сочтите за наглость, вы не могли бы показать мне, как это будет выглядеть целиком? чего то не так делаю...

[profesor08]

furcifer, currentSlide.getAttribute("src") это твоя картинка