Foros del Web » Creando para Internet » CSS »

las imagenes del rollover se desalinean

Estas en el tema de las imagenes del rollover se desalinean en el foro de CSS en Foros del Web. buenos dias. habia implementado un efecto rollover en jquery y css. se trata de que cuando le paso el mouse la imagen cambia. me mostro ...
  #1 (permalink)  
Antiguo 11/01/2011, 11:58
(Desactivado)
 
Fecha de Ingreso: abril-2008
Mensajes: 787
Antigüedad: 9 años, 7 meses
Puntos: 7
las imagenes del rollover se desalinean

buenos dias. habia implementado un efecto rollover en jquery y css. se trata de que cuando le paso el mouse la imagen cambia.

me mostro bien en ie8, firefox, google chrome y safari. pero en ie7 la cosa cambia. las imagenes que por defecto las muestro en el index se desplazan de un lado para otro. solo cuando le paso el mouse a la imagen, alli funciona bien.

aqui les dejo mi codigo css y la imagen como me muestra en ie7.

Código CSS:
Ver original
  1. /*--------------------- menu index -----------------------------*/
  2.  
  3. div#menu_index{
  4.     width:800px;
  5.     height:312px;
  6.     position:relative;
  7. }
  8.  
  9. div#menu_index ul{
  10.     margin:0;
  11.     padding:0;
  12.     list-style:none;
  13. }
  14.  
  15. div#menu_index li.menu1{
  16.     float:left;
  17.     width:252px;
  18.     height:312px;
  19.     text-align:center;
  20.     padding-left:10px; 
  21.     margin-right:12px;
  22. }
  23.  
  24. div#menu_index li.menu2{
  25.     float:left;
  26.     width:252px;
  27.     height:312px;
  28.     text-align:center;     
  29.     margin-right:12px; 
  30. }
  31.  
  32. div#menu_index li.menu3{
  33.     float:left;
  34.     width:252px;
  35.     height:312px;
  36.     text-align:center;     
  37. }
  38.  
  39. div#menu_index li a{
  40.     display:block;
  41.     position:relative;
  42. }
  43.  
  44. div#menu_index li a img{
  45.     position:absolute;
  46.     z-index:1;
  47.     left: 0px;
  48. }
  49.  
  50. div#menu_index li a span {
  51.     display:block;
  52.     width:252px;
  53.     height:312px;
  54.     position:absolute;
  55.     z-index:2;
  56. }

imagenes desordenadas.



imagen original.



saludos.
  #2 (permalink)  
Antiguo 11/01/2011, 12:08
 
Fecha de Ingreso: noviembre-2009
Ubicación: Colombía
Mensajes: 311
Antigüedad: 8 años
Puntos: 17
Respuesta: las imagenes del rollover se desalinean

¿Podrías dejar el link + código html?

;)
  #3 (permalink)  
Antiguo 11/01/2011, 13:23
(Desactivado)
 
Fecha de Ingreso: abril-2008
Mensajes: 787
Antigüedad: 9 años, 7 meses
Puntos: 7
Respuesta: las imagenes del rollover se desalinean

ah de veras. se me olvido. un lapsus.

Código HTML:
Ver original
  1. <div id="menu_index">
  2.   <ul>
  3.     <li class="menu1"> <a href="we_have_arrived.html" title="We have arrived"> <img src="images/bot_1_a.gif" border="0" /> <span><img src="images/bot_1.gif" border="0" /></span> </a> </li>
  4.     <li class="menu2"><a href="accsesories.html" title="Our pieces"> <img src="images/bot_2_a.gif" border="0" /> <span><img src="images/bot_2.gif" border="0" /></span> </a> </li>
  5.     <li class="menu3"><a href="contact_us.html" title="Contact us"> <img src="images/bot_3_a.gif" border="0" /> <span><img src="images/bot_3.gif" border="0" /></span> </a> </li>
  6.   </ul>
  7. </div>

saludos.
  #4 (permalink)  
Antiguo 12/01/2011, 09:51
(Desactivado)
 
Fecha de Ingreso: abril-2008
Mensajes: 787
Antigüedad: 9 años, 7 meses
Puntos: 7
Respuesta: las imagenes del rollover se desalinean

alguna ayuda por favor ?.

saludos.

Etiquetas: imagenes, rollover
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:41.