slick-sliderのactiveではないスライドにクラス付与がしたい

Question

slick-sliderでactive以外のスライドにクラス付与することは可能ですか?

Comments

[maisumakun]

なんのためにそのようなことが必要となったのでしょうか？

スタイルを当てたいだけなら、:not(.active)のようなセレクタを使えます。

[shibata__1124]

ご返答大変ありがとうございます！

スリックのスライドが全てで10枚あり、3枚activeでcenterModeで左右に2枚少し見えている状態(infinite: true)で、左右の2枚はopacity : 25%;をつけていて、真ん中の3枚にはopacity: 1;をつけたいです。

そのために、
.slick-slide{
opacity : 25%;
}
.slick-active{
opacity : 1 !important;
}

としました。

このようなcssを当てた場合、矢印をクリックしてスライダが1周したタイミングで全てが数秒間の間、全てがopacity :25%;ととなってしまいます。

長くなってしまい申し訳ありません。
何卒よろしくお願いいたします。

[shibata__1124]

.slick-slide:not(.slick-active) {
opacity: 0.5;
}

などを記述しましたが、1周するタイミングでslick-slideのみのスライドに入れ替わってしまうので、opacity: 25%;が付与され全体がopacity:; 25%;の状況が発生してしまいます。

[maisumakun]

> 1周するタイミングでslick-slideのみのスライドに入れ替わってしまうので、opacity: 25%;が付与され

どういう意味でしょうか？「slick-slideのみのスライド」も.slick-slide:not(.slick-active)にマッチするはずですが、そうならない事情があるのでしょうか？

[shibata__1124]

slick-activeでないといけないスライドが1周すると数秒間の間、slick-slideのみのスライドに入れ替わってしまうが原因です。

[shibata__1124]

infiniteによってslick-cloneが出ているのが原因かもしれません。