Я использую гладкий ползунок в центральном режиме, где количество slidesToShow - четное число. У меня есть требование, чтобы активные слайды имели непрозрачность 1, а остальные - 0,5. У Slick js есть класс slick-active, который применяется к нему автоматически. К сожалению, количество слайдов даже делает реализацию неправильной. введите описание изображения здесь

Как видно на рисунке, первая половина неактивного слайда слева имеет полупрозрачность. Я хочу то же самое для 5-го слайда с классом «активный слайд». Почему-то селекторы nth-child и last-child не работают, как я предполагал.

Что можно обойти?

1
Ajay Menon 6 Авг 2017 в 17:17
1
Не могли бы вы поделиться своим кодом?
 – 
José Quinto Zamora
6 Авг 2017 в 17:18
 – 
Ajay Menon
6 Авг 2017 в 18:03

2 ответа

Я сделал что-то подобное для себя, надеюсь, это поможет: http://test.woolet.co/slick-slider-centered/

    $('.center').slick({
      speed: 500,
      arrows: false,
      centerMode: true,
      centerPadding: '0px',
      slidesToShow: 3
    });
0
Paweł Kwiatkowski 7 Авг 2017 в 12:28
Привет, спасибо, Павел, но мой вопрос касается эмуляции этого эффекта, когда количество slidesToShow четное. Спасибо за комментарий.
 – 
Ajay Menon
8 Авг 2017 в 13:12

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

  $('.accom-slider').slick({
    centerMode: true,
   slidesToShow: 3
   });
1
Ramin Ahmadi 7 Авг 2017 в 12:19
Добавил код, как вы сказали. Клонированные слайды присутствуют только в slick-slider перед классом slick-center. Следовательно, только половина отображается при 1 непрозрачности.
 – 
Ajay Menon
6 Авг 2017 в 17:45