Сап ДТФ! (проблема решена!)

Помощь с SVG в Slick slider.

Как можно поменять прозрачность в button, не меняя при том прозрачность стрелки? Менял opacity в svg, не получилось. Cтавил для .slick-next/.slick-prev opacity - 0.3, а для .slick-next-img/.slick-prev-img opacity - 1. Не помогает.

Интернет прошарил, ответа не нашел.

JS:

$('.clients__slider').slick({
prevArrow: '<button type="button" class="slick-prev"><img class="slick-prev-img" src="img/arrow.svg" alt=""></button>',
nextArrow: '<button type="button" class="slick-next"><img class="slick-next-img" src="img/arrow.svg" alt=""></button>',
});

CSS:
.slick-arrow{
position: absolute;width: 60px;height: 60px;top: 497px;right: 0;background-color: #fff ;opacity: 0.4;
}
.slick-prev{
right: 60px;
}
.slick-next-img{
opacity: 1;
}
.slick-prev-img{
transform: rotate(180deg);opacity: 1;
}

55
11 комментариев

● Для фона кнопки можно задать значение цвета в RGBa формате. Например вот так:

   rgba(0,0,0, .4);

 
● Ну а если прям хочешь делать через opacity (хотя так не делают), то пропиши !important:

.slick-next-img, .slick-prev-img {
  opacity: 1 !important;
}

1
Ответить

Не учи человека дурному, !important табу в 99% случаев.

2
Ответить

Ебать я лох. Неужели все настолько изи. Спасибо братец, а то сегодня весь день мозги свои поебал.

1
Ответить

Комментарий недоступен

Ответить

Там сверху уже написали.Но все равно спасибо. Я что то забыл про rgba. Сидел, все утро себе мозги парил.

Ответить

Я так понимаю у кнопки есть бекраунд. Дай ему прозрачность через rgba.

Ответить