On, http://effikas.com/ in the Our Solutions section there is a gradient portfolio. Right now, it displays the images as they are and has a brown overlay on hover. I would like it to have the brown overlay when not hovered and display normally on hover.
Thanks for the code. It does give me the desired hover effect. However, I want the images to have a brown overlay: background: rgba(105,90,70, 0.3) !important;
before the hover and not the tie-dye look it has now. Can you help?
Hello,
The client would like to reverse the overlay effect on the gradient portfolio. The current code to add overlay on hover is:
.portfolio.hover-gradient .portfolio-item .image .overlay:before {
background: rgba(105,90,70, 0.3) !important;}
He would like the color overlay first, then a regular display on hover.
Thanks,
LF
Hi, sorry, not quite sure what do you mean. Can you pls provide more details with screenshots?
On, http://effikas.com/ in the Our Solutions section there is a gradient portfolio. Right now, it displays the images as they are and has a brown overlay on hover. I would like it to have the brown overlay when not hovered and display normally on hover.
Thanks,
LF
pls. use following css:
.hover-gradient .portfolio-item:hover .image .overlay:before, .hover-gradient .gallery-item:hover .overlay-wrap .overlay:before { opacity: 0 !important; } .hover-gradient .portfolio-item .image .overlay:before, .hover-gradient .gallery-item .overlay-wrap .overlay:before { opacity: 1 !important }Hi Michael,
Thanks for the code. It does give me the desired hover effect. However, I want the images to have a brown overlay: background: rgba(105,90,70, 0.3) !important;
before the hover and not the tie-dye look it has now. Can you help?
Thanks,
LF
This color is already in use on your site.
Yes, I meant to tell you I figured it out.
Thanks for the help!
You're welcome!
Have a nice day!