Revolution Slider Фоновый слой CSS

Question

Я пытаюсь настроить два типа слайдов в слайдере Revolution. Будет основное фоновое изображение для слайда, затем полупрозрачный слой, занимающий 40% левой или правой стороны слайда, с текстовым слоем над ним. У меня есть следующий CSS, который может достичь полупрозрачного слоя для одной стороны (справа или слева, в случае ниже, слева) с помощью "после" псевдо-селектора:

.rev_slider .slotholder:after{
width: 40%;
height: 100%;
content: "";
position: absolute;
top: 0;
left: 0;
pointer-events: none;

/* black overlay with 50% transparency */
background: rgba(0, 0, 0, 0.5);
}'

Это учитывает одну сторону прозрачности, но не другую, поэтому мне нужен класс, специфичный для слайдов, который добавляет свойство "left" или "right" к родительскому классу.slotholder. Какие-либо предложения?

Answer 1

Вы также можете попробовать использовать: перед правой стороной, пожалуйста, попробуйте использовать этот CSS

.rev_slider .slotholder:after, .rev_slider .slotholder:before{
 width: 40%;
 height: 100%;
 content: "";
 position: absolute;
 top: 0;

 pointer-events: none;

 /* black overlay with 50% transparency */
 background: rgba(0, 0, 0, 0.5);
}
.rev_slider .slotholder:before{
   right: 0;
}
.rev_slider .slotholder:after{
  left: 0;
 }

Answer 2

В разделе "Link & Seo" есть поле для добавления класса к <li> слайда - Вы можете добавить класс (например, "правый текст", "левый текст") и применить соответствующее правило CSS, например

left-text .slotholder:after{
    width: 40%;
    height: 100%;
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    pointer-events: none;

    /* black overlay with 50% transparency */
    background: rgba(0, 0, 0, 0.5);
}