Ver Mensaje Individual
  #5 (permalink)  
Antiguo 01/05/2012, 01:58
Avatar de demoche
demoche
 
Fecha de Ingreso: junio-2006
Mensajes: 124
Antigüedad: 18 años, 4 meses
Puntos: 0
Respuesta: Imagen con overlay rollover

Gracias Sergio, estuve probando tu consejo y hay algo que hago mal porque no logro que funcione, esto es lo que hice acorde a tu consejo:

Código CSS:
Ver original
  1. <style>
  2. .contenedor{
  3.     width:400px;
  4.     height:351px;
  5. }
  6. .caption{
  7.     background: rgba(236, 126, 40, 0.6);
  8.     top:0;
  9.     left:0;
  10.     width:400px;
  11.     height:351px;
  12. }
  13. div.contenedor div.caption {
  14. opacity:0;
  15. filter: alpha(opacity=0); /* IE */
  16. }
  17.  
  18. div.contenedor:hover div.caption{
  19. opacity:1;
  20. filter: alpha(opacity=50); /* IE */
  21. }
  22.  
  23. </style>

Código HTML:
Ver original
  1. <div class="contenedor"><a href="#"><img src="http://laserhairtherapywestpalmbeach.com/wp-content/uploads/2011/08/Drew-barrymore-covergirl-Copy.jpg" width="400px" height="351px" /></a>
  2. <div class="caption"></div>
  3. </div>

Así cuando me poso sobre la imagen el overlay me aparece debajo de la imagen y no encima, que hago mal?
Gracias