Tagged: Masonry Gallery
HI all,
I have a question. When i create a masonry gallery and select the grey scale effect it displays the images in grey scale and when i hover on the image it displays the actual color. How can I reverse this functionality? I would like to display grey scale on hover image.
Thank you
Hey agougo,
Could you please give us a link to your website, we need more context to be able to help you.
Best regards,
Victoria
Hello,
Here is the link to an example. I have a masonry gallery and I have activated the grey scale effect. When i mouse over on an image it will revert to the original color. I would like to do the opposite. I would like to display the image with the original colors, and when I mouse over, to display in grey scale.
Thank you
Hi agougo,
Here is the code you can put in Enfold > General Styling > Quick Css, if it does not work, put into themes/enfold/css/custom.css
#top .av-hover-overlay-grayscale .av-masonry-entry .av-masonry-image-container {
-webkit-filter: none;
filter: none;
}
#top .av-hover-overlay-grayscale .av-masonry-entry:hover .av-masonry-image-container {
-webkit-filter: grayscale(1);
filter: grayscale(1);
}
If you need further assistance please let us know.
Best regards,
Victoria
Yeap – that works :)
Thank you for the assistance!
Hi,
I’m glad this was resolved. If you need additional help, please let us know here in the forums.
Best regards,
Jordan Shannon