Reveal logo colour on hover only

  • Hello,
    I’m trying to accomplish that log colour should only be revealed when hovering using the following CSS rules, when i use “img” it works but affects ALL IMAGES on the webpage, if i use “.logo-img” it has no effect at all

    img
{
    filter: url(filters.svg#grayscale); /* Firefox 3.5+ */
    filter: gray; /* IE6-9 */
    -webkit-filter: grayscale(1); /* Google Chrome & Safari 6+ */
}
img:hover
{
    filter: none;
    -webkit-filter: none;
}

    https://www.ads-software.com/plugins/logo-slider/

Viewing 4 replies - 1 through 4 (of 4 total)
  • Plugin Author Maeve Lander

    (@enigmaweb)

    I’d have to check your site to be sure, but I think possibly the plugin stylesheet is overriding your custom styling for .logo-img

    Can you try using .logo-img (that is definitely the correct class to use if you just want it to affect the logo images only), and add !important attribute for each line in the css?

    Thread Starter zadikim

    (@zadikim)

    would it look like this?

    .logo-img
{
    filter: url(filters.svg#grayscale); /* Firefox 3.5+ */ !important
    filter: gray; /* IE6-9 */ !important
    -webkit-filter: grayscale(1); /* Google Chrome & Safari 6+ */ !important
}
.logo-img:hover
{
    filter: none; !important
    -webkit-filter: none; !important
}
    Plugin Author Maeve Lander

    (@enigmaweb)

    Yep, that’s right, give that a try.

    Thread Starter zadikim

    (@zadikim)

    does not work ??

Viewing 4 replies - 1 through 4 (of 4 total)
  • The topic ‘Reveal logo colour on hover only’ is closed to new replies.