Ver Mensaje Individual
  #2 (permalink)  
Antiguo 06/11/2013, 11:40
Avatar de C2am
C2am
 
Fecha de Ingreso: enero-2009
Ubicación: Rosario, Argentina
Mensajes: 2.005
Antigüedad: 15 años, 10 meses
Puntos: 306
Respuesta: problema para hacer que se muestre texto sobre una imagen con hover

Código HTML:
Ver original
  1. <div id="recuadro">
  2. <div id="recuadro_trans"><h1>Titulo</h1><h2>texto a mostrarse cuando alguien pasa por arriba con el mouse.</h2>
  3. </div>
  4. </div>
Código CSS:
Ver original
  1. #recuadro{
  2. width:636px;
  3. height:225px;
  4. background:green;
  5. }
  6.  
  7. #recuadro_trans{
  8. background: rgba(0,0,0,0.7);
  9. width:310px;
  10. height:115px;
  11. margin-bottom:30px;
  12. padding:5px;
  13. text-align:left;
  14. }
  15.  
  16.  
  17. #recuadro_trans h1{
  18. color:white;
  19. font-size:18px;
  20. position: relative;
  21. }
  22.  
  23. #recuadro_trans h2{
  24. color:#58ACFA;
  25. font-size:12px;
  26. display:none;    
  27. }
  28. #recuadro_trans:hover h2{display:block;}

Por ejemplo:
http://jsfiddle.net/c2am/8cHQN/10/embedded/result/
__________________
El mundo nada puede contra un hombre que canta en la miseria.
-- Ernesto Sábato--