Foros del Web » Creando para Internet » CSS »

Atributo <a> no funciona..

Estas en el tema de Atributo <a> no funciona.. en el foro de CSS en Foros del Web. Hola, tengo una galeria de imagenes en CSS, en una lista desordenada muestro la imagen en pequeño y al hacer click muestro la imagen en ...
  #1 (permalink)  
Antiguo 13/04/2009, 00:16
 
Fecha de Ingreso: marzo-2009
Mensajes: 15
Antigüedad: 8 años, 8 meses
Puntos: 0
Atributo <a> no funciona..

Hola, tengo una galeria de imagenes en CSS, en una lista desordenada muestro la imagen en pequeño y al hacer click muestro la imagen en grande en una posicion absoluta dentro de mi pagina, actualmente estoy haciendo estoy con un script de javascrip pero quisiera hacerlo solo con css, los elementos de mi lista tienen el sig codigo:

Código:
<div id="galeria-thumbs">
        		<ul id="lista-galeria">
                    <li><a href="#"><img src="imagenes/galeria/alpine sunset.JPG" alt="Alpine Sunset" /><span>Alpine Sunset</span></a></li>
</div>
Imagen, posicion absoluta:

Código:
#lista-galeria li a img {
	position: absolute;
	top: 640px;
	display: none;
	right: 80px;
	height: 440px;
	width: 580px;
	left: 462px;
	bottom: 0px;
	text-align:center;
	border: 1px solid #999;
	padding: 10px;
	float: right;
	
}
Descripcion de la imagen (<span>), posicion absoluta:

Código:
#lista-galeria li a span {
	display:none;
	position: absolute;
	left: 473px;
	top: 590px;
	width:580px;
	text-align:center;
	color: #036;
	font-size: 120%;
	background-color: #F2FCE0;
	border-top-width: 1px;
	border-bottom-width: 1px;
	border-top-style: solid;
	border-bottom-style: solid;
	border-top-color: #6FA010;
	border-bottom-color: #6FA010;
}
El problema es que cuando trato de darle estilo al atributo <a> simplemente no pasa nada, actualmente muestro la imagen grande y la descripcion de la siguiente manera:

Código:
#lista-galeria li:hover img, #lista-galeria li:hover a span {
	display:block;
}
Pero esto muestra la imagen al colocar el mouse sobre la imagen pequeña, si quiero mostrar la imagen al click de la siguiente manera no pasa nada:

Código:
#lista-galeria li a:active img, #lista-galeria li a:active span {
	display:block;
}
No es solo el valor "active" sino cualquiero (focus, hover), simplemente no funciona si manipulo el elemento <a>.

Que puede estar pasando? Gracias.
  #2 (permalink)  
Antiguo 13/04/2009, 16:31
Avatar de jomaruro
Colaborador
 
Fecha de Ingreso: junio-2002
Ubicación: Naboo
Mensajes: 5.442
Antigüedad: 15 años, 5 meses
Puntos: 361
Respuesta: Atributo <a> no funciona..

Hola:

Échale un vistazo a este ejemplo, creo que es bastante más sencillo que el que tú estás planteando.

Saludos.

Atención: Estás leyendo un tema que no tiene actividad desde hace más de 6 MESES, te recomendamos abrir un Nuevo tema en lugar de responder al actual.
Respuesta




La zona horaria es GMT -6. Ahora son las 20:52.