Foros del Web » Creando para Internet » CSS »

Problema con el explorer al interpretar código

Estas en el tema de Problema con el explorer al interpretar código en el foro de CSS en Foros del Web. Holas: he realizado una pequeña galeria de tres fotos que al pasar el cursor sobre una de ellas aparece dicha foto de fondo. Me va ...
  #1 (permalink)  
Antiguo 26/01/2009, 03:35
 
Fecha de Ingreso: enero-2009
Mensajes: 19
Antigüedad: 9 años, 4 meses
Puntos: 0
Problema con el explorer al interpretar código

Holas:

he realizado una pequeña galeria de tres fotos que al pasar el cursor sobre una de ellas aparece dicha foto de fondo. Me va bien en todos los navegadores pero en el Explorer sucede que las tres pequeñas fotos que son enlaces, al pasar el cursor sobre alguna desaparecen las demás. Si paso el cursor por la primera foto (la que está más a la izquierda) no pasa nada,pero al pasarlo por la siguiente desaparece la primera y al pasarla sobre la tercera desaparecen las otras dos. Solo sacando el cursor de la zona vuelven a aparecer.

Alguien sabe si hay algún parche o algo para el IE?
  #2 (permalink)  
Antiguo 26/01/2009, 03:41
Avatar de Aresillo
Colaborador
 
Fecha de Ingreso: marzo-2008
Ubicación: Becerril de la Sierra
Mensajes: 958
Antigüedad: 10 años, 1 mes
Puntos: 53
Respuesta: Problema con el explorer al interpretar código

pues tienes que darnos tu codigo o subirla para que la podamos ver..
de todas formas, creo que esto va en el foro de css..

Ares
__________________
Las dudas son el alimento de la inteligencia. A. Einstein
Everything we are is the end result of our thoughts. Sidhartta Gautama
  #3 (permalink)  
Antiguo 26/01/2009, 03:50
Avatar de tunait
Moderadora
 
Fecha de Ingreso: agosto-2001
Ubicación: Terok Nor
Mensajes: 16.805
Antigüedad: 16 años, 8 meses
Puntos: 380
Respuesta: Problema con el explorer al interpretar código

Trasladado desde Accesibilidad y usabilidad
  #4 (permalink)  
Antiguo 26/01/2009, 04:12
Avatar de Mikmoro
Colaborador
 
Fecha de Ingreso: octubre-2006
Ubicación: K-pax
Mensajes: 7.228
Antigüedad: 11 años, 7 meses
Puntos: 279
Respuesta: Problema con el explorer al interpretar código

Aunque te parezca mentira es mucho más habitual de lo que crees.

Mira este ejemplo a ver si te da alguna referencia sobre cómo solucionarlo.

Generalmente se basará en que necesitas una posición relativa en algún elemento en el que te falte.
__________________
Visita mi nueva web idplus.org
  #5 (permalink)  
Antiguo 26/01/2009, 10:02
 
Fecha de Ingreso: enero-2009
Mensajes: 19
Antigüedad: 9 años, 4 meses
Puntos: 0
Respuesta: Problema con el explorer al interpretar código

El código que tengo es el siguiente, no logro encontrar la forma de que funcione en el IE. En los demás navegadores funciona perfectamente como os decia.

Xhtml:

<div id="destacados">

<span><img src="http://www.forosdelweb.com/f53/img/4.jpg" class="opcion0" alt="Imagen de fondo 0" /></span>

<ul>

<li class="foto1">

<span class="opcion1">
<img src="imagenes/portada/destacados/aumento/carloau.jpg" width="600" height="300" alt="carlo" />
</span>
<a href="#">
<img src="imagenes/portada/destacados/carlo.jpg" width="200" height="100" alt="carlo" />
</a>
</li>

<li class="foto2">

<span class="opcion2">
<img src="imagenes/portada/destacados/aumento/carlodosau.jpg" width="660" height="300" alt="toreno" />
</span>
<a href="#">
<img src="imagenes/portada/destacados/toreno.jpg" width="200" height="100" alt="toreno" />
</a>
</li>

<li class="foto3">

<span class="opcion3">
<img src="imagenes/portada/destacados/aumento/carlotresau.jpg" width="600" height="300" alt="lores" />
</span>
<a href="#">
<img src="imagenes/portada/destacados/lores.jpg" width="200" height="100" alt="carlo">
</a>
</li>

</ul>

</div>

CSS:

#destacados * {
outline: 0;
margin: 0;
padding: 0;
}

#destacados {
margin: 10px auto 0;
width: 660px;
position: relative;
height: 300px;
border: solid 1px #000;
}

#destacados ul {
list-style-type: none;
position: absolute;
bottom: 10px;
left: 20px;
}

#destacados li {
display: block;
width: 200px;
height: 100px;
position: absolute;
z-index: 1;
}

#destacados .foto1, .foto2, .foto3 {
bottom: 0;
}

#destacados .foto1 {
z-index: 6;
}

#destacados .foto2 {
left: 210px;
z-index: 5;
}

#destacados .foto3 {
left: 420px;
z-index: 4;
}

#destacados span.opcion1, span.opcion2, span.opcion3 {
width: 660px;
position: absolute;
height: 300px;
top:-190px;
z-index: 0;
display: none;
}

#destacados span.opcion1 {
left:-20px;
}

#destacados span.opcion2 {
left:-230px;
}

#destacados span.opcion3 {
left:-440px;
}

#destacados span img {
width: 660px;
height: 300px;
}

#destacados a {
border: 1px solid #f00;
display: block;
width: 100%;
height: 100%;
position: absolute;
background-color: #399;
z-index: 10;
}

#destacados li:hover {
z-index: 0;
}

#destacados li:hover a {
background-color: #366;
z-index: 0;
}

#destacados li:hover span {
display: block;
z-index: 0;
}
  #6 (permalink)  
Antiguo 26/01/2009, 10:07
Avatar de Mikmoro
Colaborador
 
Fecha de Ingreso: octubre-2006
Ubicación: K-pax
Mensajes: 7.228
Antigüedad: 11 años, 7 meses
Puntos: 279
Respuesta: Problema con el explorer al interpretar código

Mira mi ejemplo. En IE6 sólo los elemetos de enlace (a) puede usar el :hover.
__________________
Visita mi nueva web idplus.org
  #7 (permalink)  
Antiguo 27/01/2009, 04:36
 
Fecha de Ingreso: enero-2009
Mensajes: 19
Antigüedad: 9 años, 4 meses
Puntos: 0
Respuesta: Problema con el explorer al interpretar código

Cita:
Iniciado por Mikmoro Ver Mensaje
Mira mi ejemplo. En IE6 sólo los elemetos de enlace (a) puede usar el :hover.
He visto tu ejemplo mik y falla en el IE también,lo cual quiere decir que este efecto no es del todo compatible aún con el explorer no?
  #8 (permalink)  
Antiguo 27/01/2009, 12:17
Avatar de Mikmoro
Colaborador
 
Fecha de Ingreso: octubre-2006
Ubicación: K-pax
Mensajes: 7.228
Antigüedad: 11 años, 7 meses
Puntos: 279
Respuesta: Problema con el explorer al interpretar código

Cita:
Iniciado por Polesu Ver Mensaje
He visto tu ejemplo mik y falla en el IE también
¿A qué IE te refieres? porque en IE6 va perfectamente, en IE7 no estaba mirado y ahora veo que las fotos salen algo más arriba de lo debido, pero en ningún caso producen el fallo del que hablabas en tu primer mensaje. Esto era un ejemplo de cómo puedes hacer para eliminar el error del que hablabas.
__________________
Visita mi nueva web idplus.org
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 07:25.