Hover effect on image

[SirenaColella]

Hello guys, I need your help. I attach here my code on codepen.

http://codepen.io/Colella/pen/NbRxmx

I would like to create a hover effect for my first picture. From an opacity starting .5 I would go to opacity 1.
Under my image there is a background-color: #607099. With the hover effect would that the picture was to opacity 1 and that you read the name of the image.

The second image is only demo with opacity 1

I hope you can help me. Thanks very very much!

[Shikkediel]

You could add this:

.portfolio-box-caption {
  pointer-events: none;
}

It’s because the caption is on top, blocking the hover event. Adding that property makes it so it’s “ignored” by the mouse.

[SirenaColella]

Hi @Shikkediel, thanks a lot! I don’t know this property. Thanks a lot! Now I’m studying from this post
https://css-tricks.com/almanac/properties/p/pointer-events/

THANKS A LOT!

[Author]

Posts