Как удалить ненужный фон, когда слайд активен в навигации по слайдеру?

#javascript #html #jquery #css #slick.js

Вопрос:

При активном слайде в маркере отображается белый фон, который я установил для неактивных слайдов, как я могу заставить его исчезнуть на активном слайде?

Код jsfiddle.net/mpvow81d/

Сайт ilyin1ib.beget.tech

введите описание изображения здесь

 
    .slick-dots li button {
        height: 4px !important;
        padding: 4px !important;
        width: 20px !important;
        background: #fff!important;
        opacity: 0.5;
    }

    li.slick-active {
        width: 40px !important;
        height:100% !important;
        background: @orange !important;
        z-index:99 !important;
        transition: 0.3s;
    }


    .slick-dots li button:before {
      display:none;
    }


    .slick-dots {
      bottom: 100px !important;
      box-sizing: border-box;
    }

 

Комментарии:

1. Сэр, если на вопрос получен правильный ответ, то принятие ответа было бы большой помощью, спасибо.

Ответ №1:

Уважаемый разработчик, проблему можно решить так :

  1. В соответствии с тем, как вы хотите
 .slick-active button{
display:none;
}
 

2.правильный или простой способ сделать это.

 .slick-active button{
background:#ff5722 !important;
}
 

В решении два вместо того , чтобы придавать стили активному слику и превращать его в оранжевый контейнер, вы можете просто изменить цвет белой кнопки внутри активного класса слика на оранжевый, что делает ваш код небольшим, простым и удобным.

предложение: Загрузите свой код в code pen или на любые другие сайты, такие как repl, я лично обнаружил трудности в js fiddle.