discos_teste

container
{
position: relative;
width: 50%;
}

.image
{
display: block;
width: 100%;
height: auto;
}

.overlay
{
position: absolute;
top: 0;
bottom: 0;
left: 0;
right: 0;
height: 100%;
width: 100%;
opacity: 0;
transition: .5s ease;
background-color: #008CBA;
}

.container:hover .overlay
{
opacity: 1;
}

.text
{
color: white;
font-size: 20px;
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
-ms-transform: translate(-50%, -50%);
}

Fade in Overlay

Hover over the image to see the effect.

Avatar

Hello World