Foros del Web » Creando para Internet » CSS »

Problema con opacity

Estas en el tema de Problema con opacity en el foro de CSS en Foros del Web. Hola a todos/as, estoy haciendo una galeria en CSS y una lista en HTML. Lo que hace el codigo es que cuando el raton pasa ...
  #1 (permalink)  
Antiguo 30/03/2009, 13:29
Avatar de Ratus-BROWN  
Fecha de Ingreso: febrero-2009
Ubicación: Valencia
Mensajes: 169
Antigüedad: 15 años, 1 mes
Puntos: 8
Problema con opacity

Hola a todos/as,


estoy haciendo una galeria en CSS y una lista en HTML. Lo que hace el codigo es que cuando el raton pasa por las imagenes cambia la opacidad de 80% a 1, es decir inicialmente aparecen semitransparentes y al pasar el raton por encima se ven sin opacidad. Este es mi codigo:

Código HTML:
 <ul id="gallery">
    
       <li><a href=""><img src="./img/galeria1/im1g1.jpg" width="141" height="80" alt="" border="0"></a></li>
       <li><a href=""><img src="./img/galeria1/im2g1.jpg" width="141" height="80" alt="" border="0"></a></li>
       <li><a href=""><img src="./img/galeria1/im3g1.jpg" width="141" height="80" alt="" border="0"></a></li>
       <li><a href=""><img src="./img/galeria1/im4g1.jpg" width="141" height="80" alt="" border="0"></a></li>
    
    </ul> 
Y el CSS:

Código:
#gallery {
     list-style:none;
}
#gallery li {
         float:left;
	 padding: 0.2em;
}
#gallery li a img {
        border: 1px solid #333;
	 padding: .1em;
	 opacity:.80;
	 filter: "alpha(opacity=80)"; /* expected to work in IE 8 */  
         filter: alpha(opacity=80);   /* IE 4-7 */   
}
#gallery li a img:hover {
     border-color: 1px solid #CCC;
     opacity:1;
     filter: "alpha(opacity=100)"; /* expected to work in IE 8 */  
     filter: alpha(opacity=100);   /* IE 4-7 */  
     zoom: 1;     
}
Entonces, este código funciona para todos los navegadores menos para IE, mi pregunta es ¿ el problema viene por opacity que no lo reconoce IE? o por otro lado esta en la regla img:hover que no la soporta IE.......buen ya me decis.....



Gracias
  #2 (permalink)  
Antiguo 30/03/2009, 13:36
Avatar de jomaruro
Colaborador
 
Fecha de Ingreso: junio-2002
Ubicación: Naboo
Mensajes: 5.442
Antigüedad: 21 años, 8 meses
Puntos: 361
Respuesta: Problema con opacity

Hola:

opacity es CSS3 y no es reconocido por IE (desconozco si funciona en IE8), creo haber visto en algún sitio la forma de solucionarlo pero no recuerdo donde; si me acuerdo te lo digo.

Siento no poder ayudarte más.

Saludos.

  #3 (permalink)  
Antiguo 30/03/2009, 16:08
Avatar de Mikmoro
Colaborador
 
Fecha de Ingreso: octubre-2006
Ubicación: K-pax
Mensajes: 7.228
Antigüedad: 17 años, 5 meses
Puntos: 280
Respuesta: Problema con opacity

Cita:
Iniciado por Ratus-BROWN Ver Mensaje
o por otro lado esta en la regla img:hover que no la soporta IE
Efectivamente IE6 no soporta un :hover en un elemento que no sea un enlace.

La opacidad para IE la estás indicando con el filter alpha.
  #4 (permalink)  
Antiguo 30/03/2009, 16:35
Avatar de jomaruro
Colaborador
 
Fecha de Ingreso: junio-2002
Ubicación: Naboo
Mensajes: 5.442
Antigüedad: 21 años, 8 meses
Puntos: 361
Respuesta: Problema con opacity

Hola:

Cita:
Iniciado por Mikmoro Ver Mensaje
La opacidad para IE la estás indicando con el filter alpha.
O sea, he metido la pata.

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 08:30.