HTML

<div class="hovergallery7"><img src="http://www.ephotobay.com/image/3-632.gif" alt=" " width="190" height="210" /><img src="http://www.ephotobay.com/image/4-776.gif" alt=" " width="190" height="210" /></div>

CSS

.hovergallery7 img { 
 margin: 10px 10px 10px 10px; 
 opacity: 0.3;/* l'opacite que vous voulez au depart */
 border-radius: 10%;
box-shadow:1px 1px 10px #000;
border: 1px dotted #000;
 -ms-filter: "prodig:DXImageTransform.Microsoft.Alpha(Opacity=25)"; /* Hack IE8 */
 filter: alpha(opacity = 25); /* Hack IE 5-7 */
 -webkit-transition: opacity 0.5s ease-in-out;/* transition pour Chrome et Safari */
 -moz-transition: opacity 0.5s ease-in-out;/* transition pour Firefox */
 -o-transition: opacity 0.5s ease-in-out;/* transition pour Opéra */
 transition: opacity 0.5s ease-in-out; /* on écrit cette ligne à la fin de façon à ce que ce soit elle qui soit prise en compte lorsque l'attribut transition sera pris en compte par tous les navigateurs */
 
}
 
.hovergallery7 img:hover {
 opacity: 0.9; /* opacite au survol */
 -ms-filter:"prodig:DXImageTransform.Microsoft.Alpha(Opacity=90)"; /* Hack IE 8 */
 filter: alpha(opacity = 90); /* Hack IE 5-7 */
-moz-transform: translate3d(-5%, -5%, 0); /* position caption outside layout horizontally and centered vertically */
 -webkit-transform: translate3d(-5%, -5%, 0);
 transform: translate3d(-5%, -5%, 0);
 opacity: 1;
 -moz-transition: all 0.5s;
 -webkit-transition: all 0.5s;
 transition: all 0.5s; 
}