Задать вопрос
@xonar
А смысл?

Как заставить работать несколько slick слайдеров в табах?

Доброго вечера.

Сделал табы, где внутри каждого таба лежит slick слайдер. При переключение на один таб, другие прячутся, как обычно. Но, всегда работает только слайдер из 1 таба. В остальных табах слайдер не отображается. Причину найти не могу.

Пробовал даже каждому слайдеру задавать свой класс и инциализировать его по уникальному классу - https://github.com/kenwheeler/slick/blob/master/in...

Тоже не помогло.

Код на примерах 2 табов, собачки всё ок, а вот кошки проблема - https://codepen.io/ruslan-lysenko/pen/LYpBEjL
  • Вопрос задан
  • 165 просмотров
Подписаться 1 Простой Комментировать
Решение пользователя Владислав Бойченко К ответам на вопрос (2)
vladislav_boychenko
@vladislav_boychenko
Купаюсь в гривнах
При переключении таба реинициализируйте слайдер. Конкретно в вашем случае можно элементарно все слайдеры таким образом:
[...document.querySelectorAll('.services-list')].forEach(item => {
  item.slick('refresh');
});

Но есть загвоздка -- вам это нужно сделать в HTMl, где у вас подключен Slick, так как в области JS библиотека не подключена и соответственно такого метода нет.
Ответ написан