Показать div внутри текущего слайда

Question

Я использую слайдер Slick, и я пытаюсь отобразить некоторые Div с цитатой только на текущем слайде. Я пытался сделать это таким образом:

function displayQuote() {
 if ($('div').hasClass("slick-current")) {
  $(this).find('.quote').css('display', 'block');
 }
}
displayQuote();

но это не работает вот полный код: http://codepen.io/pjmtokyo/pen/JYyjew

Я только начинающий, поэтому я был бы признателен за любую помощь

Answer 1

Это проще, чем это. Сначала нужно скрыть все подписи. После того, как подписи скрыты, вы должны показать заголовок текущего слайда. Когда слайд становится активным (текущий слайд), он становится активным. Вы используете это и отображаете заголовок внутри этого класса. Ниже приведен код для этого. Я надеюсь, что это решит вашу проблему.

figcaption {
   display: none;
}

.slick-active figcaption {
  display: block;
}