search

ciar4n / imagehover.css

Pure CSS Image Hover Effect Library
http://imagehover.io
MIT License
1.8k stars 234 forks source link

Transparent background on figcaption #13

Closed ericabao closed 5 years ago

ericabao commented 7 years ago

Hi guys any idea how to make an rgba background works? I have tried it but it seems not working... I just want to use a semi transparent figcaption background.

ciar4n commented 7 years ago

Hello

Using semi transparent backgrounds will vary depending on the effect. Which effect are you using?

Ciarán

oscarkwan commented 6 years ago

Which effects work for transparent?

marchandrs commented 5 years ago

one year later, still waiting

ciar4n commented 5 years ago

The background element to the caption on hover varies from effect to effect. In most cases the following will work which covers most elements. Note in some cases the backgound image has been transformed to be no longer available or no longer front facing. 

[class^="imghvr-"] figcaption, 
[class*=" imghvr-"] figcaption,
[class^="imghvr-"]:before, 
[class*=" imghvr-"]:before,
[class^="imghvr-"]:after, 
[class*=" imghvr-"]:after {
    background-color: rgba(19, 87, 150, .5) !important; 
}

Where 19, 87, 150 is the RGB color and .5 is the transparency.

Ciaran

marchandrs commented 5 years ago

will test it in my project when i get home, thank you :D