JQuery SliderProの"現在の画像"以外の画像を半透明にしたい

Question

某企業のウェブサイトを作っています。
JQueryのSliderPro（http://bqworks.com/slider-pro/）を使って
製品画像のスライドショーをつける予定です。

制作者（bqworks.com）のexample2（http://bqworks.com/slider-pro/#example2）の形式のように
現在の画像（中央）以外の、左右にも前後の画像が表示されるようにしています。

この時、現在の画像以外を半透明にする方法はあるのでしょうか。

例えば、画像（A、B、C、D、E）を5枚使うとして、
Cが中央にある場合、Cのみはopacityを1、残りのA、B、D、Eはopacityを0.5にする。
次にDが中央に移動した場合、Dのみをopacityを1、残りのA、B、C、Eはopacityを0.5にする。
このような機能を実現したいと思っています。

スターフィールド社のサイトにオプションの解説がありましたが、
不透明度に関するオプションはなさそうです。。。
https://sterfield.co.jp/designer/%E3%82%AF%E3%83%BC%E3%83%AB%E3%81%A7%E3%82%AB%E3%83%83%E3%82%B3%E3%82%A4%E3%82%A4%E3%81%84%E3%82%8D%E3%82%93%E3%81%AA%E6%A9%9F%E8%83%BD%E6%BA%80%E8%BC%89%E3%81%AE%E3%82%B9%E3%83%A9%E3%82%A4%E3%83%80/

もし同じようなことにチャレンジしたことがある方がいらっしゃれば、
アドバイスをいただけますと幸甚です。

どうぞよろしくお願いいたします。

Answer 1

slider-pro.cssを少し修正するだけで解決できそうです。

.sp-slide {
	position: absolute;
	opacity: 0.5;
}

.sp-selected{
	opacity:1;
}

Comments

[byxbee]

ありがとうございます。解決できました。

Answer 2

同じ実装ならこれでいけると思います。

.sp-selected {
    opacity: 1;
}
.sp-slide {
    opacity: .5;
}

Comments

[byxbee]

ありがとうございます。解決できました。