Как правильно подвязаться на событие sliderChange библиотеки swiper?

Здравствуйте! я хочу добиться плавного появления текста на том слайдере, который активный в данный момент(имеет класс swiper-slide-active) и исчезали бы при наличии у них класса swiper-slide-prev
Помогите подправить пожалуйста: https://codepen.io/Alexei_87/pen/poyvLQZ

Тебе нужно привязаться к одному из событий https://swiperjs.com/api/#events. Я бы пробовал сначала slideNextTransitionEnd. Но их много, может это не то что тебе надо.

Потом тебе нужно получить доступ к DOM элементу которому меняешь классы. Попробуй создать обработчик события с аргументом (это обычная конвенция библиотек передавать объект события аргументом в обработчик события), может из объекта можно будет достать этот DOM объект. Если так не получится, что посмотри в API самого слайдера как получить доступ к текущему слайду. Остальное - вопрос добавления/удаления классов.

Подвязался к slideChange событию. Оно работает, но я класс не могу добавить. Не понимаю, почему не добавляется…
swiper.on(‘slideChange’, function () {

if($(’.swiper-slide’).hasClass(‘swiper-slide-active’)){
$(’.textblock’).addClass(’.opac’);
}
if($(’.swiper-slide’).hasClass(‘swiper-slide-prev’)){
$(’.textblock’).removeClass(’.opac’);

}

num += 1;

if(num == 4){
changeDirection();
num = 0;
}
});

Дело в тайминге и порядке операций. Лучше всего опираться не на css классы, а на внутреннее представление слайдов в самой библиотеке. Она дает индекс активного слайда, от него и отталкивайся:

on: {
      slideNextTransitionEnd: function (swiper) {
        console.log('CurrentActive:', swiper.activeIndex)
      }
    }