使滑块箭头在魔术滑块中始终可见

Question

在我的网站上使用魔术滑块

http://m2.alothemes.com/bencher/

在这里，我想使箭头始终可见。所以我写了下面的CSS代码

.slick-next.slick-arrow, .slick-prev.slick-arrow{

    display: block;
    visibility: visible;
    opacity: 1;
    background-color: #eeeeee73 !important;
    border-radius: 2px;
}

此代码有效。但是问题是，当我将鼠标悬停时，箭头没有显示，并且一种效果即将到来。请尝试解决此问题。

我希望滑块箭头始终带有背景色。当前，只有当我们将滑块悬停时才可见。

Answer 1

您可以在css下方添加内容，以帮助您获得所需的输出。

.home-slider.home-slider-index .slick-arrow {
    OPACITY: 1;
    visibility: visible !important;
}

Answer 2

您在（索引）（页内CSS？）中有以下规则：

.slick-prev, .slick-next {
   color: #707070;
   background-color: #4f0606;
   border-color: #ffffff;
}

覆盖您编写的规则。为了解决这个问题，您可以在要覆盖的属性旁边添加!important，或考虑重新组织CSS文件的导入

Answer 3

将此类添加到滑块箭头。

.staticArrow{ opacity: 1 !important; visibility: visible !important; }