Viewing 2 posts - 1 through 2 (of 2 total)
  • Author
    Posts
  • November 10, 2021 at 12:28 pm #1328476
    AddonDigital

    Hi,

    Im using a Partner Logo carousel slider.

    I would like to have a default dark overlay, then when we hover the overlay disappears.

    I’ve also noticed the buttons on the slider are cropped off.

    Please assist with CSS snippet.

    Thank you

    November 10, 2021 at 4:11 pm #1328538
    Ismael

    Hey AddonDigital,

    Thank you for the inquiry.

    You can use this css code to apply a default overlay to the slider items. The overlay will disappear or fade out on hover.

    #top .avia-logo-element-container .slide-entry:after {
    content: '';
    display: block;
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    background: rgba(0,0,0,0.5);
    visibility: visible;
    transition: all 0.5s;
}

#top .avia-logo-element-container .slide-entry:hover:after {
    background: rgba(0,0,0,0);
}

    Please toggle or temporarily disable the Enfold > Performance > File Compression settings after adding the css code.

    Best regards,
    Ismael

  • Author
    Posts
Viewing 2 posts - 1 through 2 (of 2 total)
  • You must be logged in to reply to this topic.