Hi there,
Is there a way to make the partner/logo grid be black & white and then when I hover over the picture it would show color? If so, how do I do this?
Thanks,
Mark
Hi markjoseph7!
Please add following code to Quick CSS in Enfold theme options under Styling
#top .avia-logo-element-container img { filter: grayscale(100%); -webkit-filter: grayscale(100%); filter: gray; -webkit-transition: all .6s ease; }
#top .avia-logo-element-container img:hover { filter: grayscale(0%); -webkit-filter: grayscale(0%); filter: none; }
Regards,
Yigit
Hi Yigit,
Only half of it worked. So the images turned to grayscale, but when I hover over it, it’s still in grayscale and the yellow icon with the arrow appears.
I’d like it so the yellow icon with the arrow does not appear, and the images would just show their color when I hover over them.
Here’s an example at the very bottom of the page:
http://kriesi.at/themes/replete/?skin=Greyscale
Thanks,
Mark
Hello!
It worked fine on my end actually. Have you tried adding !important to all codes + flushing your browsers cache and refreshing a few times?
A link to your website would be helpful, can you post it?
Cheers!
Yigit
Hey!
Please try adding following code as well
.avia-content-slider-inner .image-overlay { display: none!important; }
Cheers!
Yigit
Edited the code
Perfect! Works great! Thanks so much, Yigit!