FOTO QUE AL PONER EL MOUSE OCULTA TEXTO

Para poder hacer esto teméis que poner este código o bien en un gadget o en una entrada HTML.

<center><style type="text/css">
 .img-side{
 background: # COLOR FONFO HTML;
 color: #000000;
 width: 305px;                
 height: 200px;
 margin-top:-215px;
 opacity: 0;
 -webkit-transition:all .5s ease-in-out; }
 .img-side:hover{
 opacity:.6
 }
 </style>
 <img src=" URL DE LA FOTO  " width="300" />
 <br />
 <div class="img-side">
 <br />
 <center><FONT FACE="arial" SIZE=2 COLOR=#COLOR HTML DEL TEXTO>TEXTO QUE QUIERAS QUE APAREPCA AL PONER EL MOUSE ENCIMA</FONT></center></div></center>

"arial"           CAMBIA POR EL TIPO DE LETRA QUE QUIERAS
width: 305px;   ESTE ANCHO SIEMPRE TIENE QUE SER UN POCO MAYOR QUE EL DE LA IMAGEN  " width="300"

height: 200px;  ESTA ALTURA SIEMPRE UN POCO MENOS QUE ESTA  margin-top:-210px

opacity:.6      ES SE CAMBIA POR EL TONO DE OPACIDAD ( OSCURO) QUE LE QUIERAS
DAR




TEXTO QUE QUIERAS QUE APAREPCA AL PONER EL MOUSE ENCIMA