Adding a link to an image with revealing text on hover

Hi,

I like to add a link to an image with revealing text on hover. I don't know how to do it. 

To understand better my problem, Please find the attached.

It would be great if you help me to sort it out. 

Thank you.

Hi,

You can add an Image Block - Inline

Next, add some caption

Next, add this to Design > Custom CSS

figcaption.image-caption-wrapper {
    visibility: hidden !important;
    transition: all 0.3s ease;
  pointer-events: none;
}
.design-layout-inline:hover figcaption.image-caption-wrapper {
    visibility: visible !important;
    max-height: 100% !important;
    height: 100% !important;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.3s ease;
}