Tagged: Masonry hover
Hey,
What CSS do I need to add for the hover on my masonry grid? I would like a color of my choice, red for example, instead of the opacity and to keep the originally zoom effect as well.
( Example of hover color (just the color, I don’t the text): http://peacheyphotography.co.uk/)
I’m here in my CSS research:
.avia_desktop .av-masonry-entry:hover .av-masonry-image-container {
-webkit-transform: none;
-moz-transform: none;
transform: none;
opacity: 0.5!important;
}
Thanks a lot for your help.
Regards,
Bibahbuh
Hey bibahbuh,
I edited your page and changed masonry caption style. Please add following code to Quick CSS in Enfold theme options under General Styling tab to change overlay background color
#top .av-caption-style-overlay.av-hover-overlay- a.av-masonry-item-with-image .av-inner-masonry-content {
background: rgba(255,0,0,0.3);
}
255,0,0 is RGB value of the color and 0.3 is opacity level
Best regards,
Yigit