bxSlider onSlideBefore newbieQ

Question

Я пытаюсь настроить непрозрачность центрального слайда в карусели из трех (для эмуляции этого сайта http://www.tyinarchitects.com/) в чувствительном слайдере с использованием bxSlider, но не может получить синтаксис справа.

Когда я использую $ slideElement.addClass ('active-slide'); эффект происходит только на неправильных слайдах, поэтому, пока моя основная идея работает, мне нужно ссылаться на слайд, используя oldIndex и NewIndex, а не на $ slideElement.

Я пробовал различные перестановки из: -

$slider.children.eq(oldIndex).removeClass('active-slide'); 
$slider.$children.eq(oldIndex).removeClass('active-slide'); 
$('.slider2').children.eq(newIndex).addClass('active-slide'); 

И все они только засоряют работу так что мой синтаксис JS, очевидно, не так. Может ли кто-нибудь пожалеть меня?

Полный рабочий код

$(document).ready(function(){ 
    $('.slider2').bxSlider({ 
    slideWidth: 300, 
    minSlides: 3, 
    maxSlides: 3, 
    moveSlides: 1, 
    slideMargin: 0, 
    pager: false, 
    auto: true, 
    onSlideBefore: function($slideElement, oldIndex, newIndex){ 
    $slideElement.addClass('active-slide'); 
      }, 
    onSlideAfter: function($slideElement, oldIndex, newIndex){ 
    $slideElement.removeClass('active-slide'); 
      } 
    }); 

Answer 1

Давайте предположим, что ваш HTML выглядит следующим образом:

<div id="container"> 
    <div class="slide">Slide 1</div> 
    <div class="slide">Slide 2</div> 
    <div class="slide">Slide 3</div> 
</div> 

Тогда вы можете попробовать следующее:

onSlideBefore: function($slideElement, oldIndex, newIndex) { 
    $('#container>div').eq(newIndex).addClass('active-slide')); 
}