Ломается слайдер внутри jquery tabs ломается. Знает кто решение?

Question

[Дмитрий]

Всем привет. Вообщем, есть вкладки ( табы ) сделанные с помощью Jquery ui, внутри которых расположены слайдеры. Первый слайдер удалось починить кодом:

Код CSS

/* Based on https://github.com/kenwheeler/slick/issues/187#issuecomment-59123524 */
/* bootstrap hack: fix content width inside hidden tabs */
.tab-content > .tab-pane,
.pill-content > .pill-pane {
  display: block;
  /* undo display:none          */
  height: 0;
  /* height:0 is also invisible */
  overflow: hidden;
  /* no-overflow                */
}
.tab-content > .active,
.pill-content > .active {
  height: auto;
  /* let the content decide it  */
}
/* bootstrap hack end */

Данный код помогает только первому слайдеру во вкладке, остальные слайдеры на других вкладках ломаются:

Скриншот ошибки

Может кто-то встречал такое? как быть? Если нужно скину ссылку на сайт

Comments

[Zombie42679]

Обновляй слайдер при клике на таб

[Дмитрий]

Zombie42679, подскажи пожалуйста код

[Zombie42679]

Дмитрий, А что за слайдер то ?) Документацию слайдера почитай, там в методах будет

[Дмитрий]

Zombie42679, slick

[Zombie42679]

Дмитрий, попробуй что-то такое, давно сликом не пользовался, не помню как его обновить. Перешел на swiper и owl иногда.

$('tab').click(function() {		
	$('slick-slider').slick('reinit');
});

Answer 1

[Антон]

Как решить проблему с отображением слайдера Slick?

Comments

[Дмитрий]

Спасибо. Первый вариант рабочий

Answer 2

[Дмитрий]

Всем спасибо. Решение найдено, код:

$('.tabs-v ul li').click(function() {
		$(".calendar__slider").slick('reinit');
	});