Fade effect on hover for images

img {
     opacity: 0.3;
     transition: opacity 1s ease-in-out;
     -moz-transition: opacity 1s ease-in-out;
     -webkit-transition: opacity 1s ease-in-out;
}

img:hover {
     opacity: 1.0;
     transition: opacity .55s ease-in-out;
     -moz-transition: opacity .55s ease-in-out;
     -webkit-transition: opacity .55s ease-in-out;
}

You can also use this function with Fade Grayscale Hover Effect on Images (Grayscale to Colored).

Source: http://stackoverflow.com/questions/11375724/fade-in-fade-out-on-image-hover-using-css3