Ver Mensaje Individual
  #1 (permalink)  
Antiguo 23/04/2009, 03:16
Senku
 
Fecha de Ingreso: abril-2009
Mensajes: 18
Antigüedad: 15 años, 7 meses
Puntos: 0
Galería de imágenes con CSS en dos contenedores distintos

Buenas a todos,

Tengo una sección en mi web con galería de imágenes y me surgen problemillas. Lo primero que tenéis que saber es que las miniaturas de la galería están maquetadas como lista con display:inline y se ven horizontalmente, al pasar el ratón por ellas hay un hover que hace que la imagen grande aparezca un poco más abajo de las miniaturas, más o menos en el centro de la pantalla. Si clickeas la miniatura la imagen se queda fija aunque si pasas el ratón por el resto se ponen encima. Si quitas el ratón de las miniaturas, la imagen que queda es la última en la que hiciste click o, si no has hecho click en ninguna, pues ninguna queda. Es un modelo que he visto en un tutorial.

Los problemas son estos:

Necesito que la galería de miniaturas esté en un contenedor (para poder aplicarle un fondo y un borde inferior y que quede como una sección separada de donde aparecen las imágenes en grande, pero si formateo el contenedor que tengo, obviamente, las imágenes grandes permanecen ocultas porque salen fuera de las medidas dadas al contenedor. La solución sería que las imágenes grandes apareciesen en otro contenedor diferente a donde están las miniaturas

Además, me gustaría asociar un texto a cada foto grande.

Por otra parte, la lista de miniaturas, al llegar a la derecha de la pantalla pasan a una siguiente fila y a mí me gustaría aplicar un scroll horizontal para que hubiese una fila única ya que quiero que este contenedor con miniaturas sea de un alto fijo de 120px o así. Supongo que al tratarse de una lista de links (forma parte del método explicado en el tutorial para crear la galería) el salto de línea es automático y no sé si se podrá arreglar.

Supongo que no es del todo fácil lo que quiero, pero... :)

Muchas gracias por anticipado