Как стилизовать такие кнопки навигации слайдера?

Question

[iMurser]

Использую слайдер Owl Carousel, но в макете эти точки навигации сделаны в таком виде. Как можно реализовать такое?Насколько понимаю, делается это только через JS, так как нужно, чтобы при переходе на следующую точку менялись цвета у двух соседних.

Comments

[Lord_Dantes]

Кхм..
В теории так.
Если самая грубая(черная) точка является центральной(та что показывает текущий слайд), и исходя из нее остальные стают прозрачней. И если она будет по центру и точки будут прозрачными слева и справа от центральной то можно сделать в принципе так.

Есть такое себе решение но можейт подойти думаю. Суть заключается в том чтобы давать всем парным и не парным одну прозрачность и первым/последним давать прозрачность больше.

https://codepen.io/lord-dantes/pen/ewjNYN

Или сделать реализацию на SCSS/SASS

Answer 1

[Евгений Оксенчук]

Задай им прозрачность opacity, или через rgba