Tema: Menu desaparece en IE7
Ver Mensaje Individual
  #1 (permalink)  
Antiguo 15/03/2011, 18:08
v_black03
 
Fecha de Ingreso: marzo-2011
Mensajes: 1
Antigüedad: 13 años, 1 mes
Puntos: 0
Menu desaparece en IE7
Hola quisiera su ayuda para resolver un gran problema que desde hace dias me esta desesperando.

Lo q pasa es q tengo una pagina con un menu hecho con mousewheel, y en firefox, chrome e IE8 no hay problema, el problema es q mi cliente lo ve en IE7 y por alguna razon cuando se mueve el scroll el menu se mueve e incluso desaparece, ya me canse de moverle al css y na mas nada asi q solicito su ayuda o sus consejos para resolver
De antemano gracias por la ayuda
Y si, si quisiera decirle a mi cliente q cambie de navegador. Como odio IE

aqui esta el css original
Código CSS: 
Ver original
  1. #submenu, #submenu ul{
  2. margin:0;
  3. padding:0;
  4. list-style-type:none;
  5. list-style-position:outside;
  6. position:relative;
  7. line-height:1.5em; 
  8. }
  9.  
  10. #submenu a{
  11. display:block;
  12. padding:0px 5px;
  13. text-decoration:none;
  14. color:#fff;
  15. }
  16.  
  17. #submenu li ul li a:hover{
  18. background-color:#fff;
  19. color:#78bfeb;
  20. float:right;
  21. }
  22.  
  23. #submenu li{
  24. float:left;
  25. position:relative;
  26. }
  27.  
  28. #submenu ul {
  29. position:absolute;
  30. display:none;
  31. width:600px;
  32. }
  33.  
  34. #submenu li ul a{
  35. border-top:1px #fff solid;
  36. border-bottom:1px #fff solid;
  37. width:auto;
  38. height:auto;
  39. }
  40.  
  41. #submenu ul ul{
  42. top:auto;
  43. }   
  44.  
  45. #submenu li ul ul {
  46. top:20px;
  47. width:600px;
  48. margin:0px 0 0 10px;
  49. }
  50.  
  51. #submenu li ul ul li a{
  52.     float:left;
  53. }
  54.  
  55. #submenu li:hover ul ul, #submenu li:hover ul ul ul, #submenu li:hover ul ul ul ul{
  56.     display:none;
  57. }
  58.  
  59. #submenu li:hover ul, #submenu li li:hover ul, #submenu li li li:hover ul, #submenu li li li li:hover ul{
  60.     display:block;
  61. }
  62.  
  63. #submenu .prod_Minipix{
  64.     width:135px;
  65.     height:114px;
  66.     background-image:url("../img/layout/icono_minipix.png");
  67.     background-position:top left;
  68.     background-repeat:no-repeat;
  69.     font-size:0px;
  70. }
  71.  
  72. #submenu .prod_nTSistemas{
  73.     width:135px;
  74.     height:114px;
  75.     background-image:url("../img/layout/icono_sistemas02.png");
  76.     background-position:top left;
  77.     background-repeat:no-repeat;
  78.     font-size:0px;
  79. }
  80.  
  81. #submenu .prod_nTPCB{
  82.     width:135px;
  83.     height:114px;
  84.     background-image:url("../img/layout/icono_pcb02.png");
  85.     background-position:top left;
  86.     background-repeat:no-repeat;
  87.     font-size:0px;
  88. }
  89.  
  90. #submenu .prod_nTransporte{
  91.     width:135px;
  92.     height:114px;
  93.     background-image:url("../img/layout/icono_transporte02.png");
  94.     background-position:top left;
  95.     background-repeat:no-repeat;
  96.     font-size:0px;
  97. }
  98.  
  99. #submenu .prod_Minipix:hover, #submenu .prod_nTSistemas:hover, #submenu .prod_nTPCB:hover, #submenu .prod_nTransporte:hover
  100. {
  101.     background-position:bottom;
  102. }

Aqui el modificado para que se vea en IE7
Código CSS: 
Ver original
  1. #submenu .prod_Minipix{
  2.                     width:135px;
  3.                     height:114px;
  4.                     position:relative;
  5.                     top:0px;
  6.                     left:0px;
  7.                 }
  8.                 
  9.                 #submenu .prod_nTSistemas{
  10.                     width:135px;
  11.                     height:114px;
  12.                     position:relative;
  13.                     top:0px;
  14.                     left:0px;
  15.                 }
  16.                 
  17.                 #submenu .prod_nTPCB{
  18.                     width:135px;
  19.                     height:114px;
  20.                     position:relative;
  21.                     top:0px;
  22.                     left:0px;
  23.                     }
  24.                 
  25.                 #submenu .prod_nTransporte{
  26.                     width:135px;
  27.                     height:114px;
  28.                     position:relative;
  29.                     top:0px;
  30.                     left:0px;
  31.                 }
  32.                 
  33.                 #submenu .prod_Minipix:hover, #submenu .prod_nTSistemas:hover, #submenu .prod_nTPCB:hover, #submenu .prod_nTransporte:hover{
  34.                     background-position:bottom;
  35.                 }
  36.                 
  37.                 #submenu {
  38.                     top:auto;
  39.                     left:auto;
  40.                     height:auto;
  41.                     position:relative;
  42.                     display:block;
  43.                 }
  44.                 
  45.                 #submenu ul {
  46.                     top:auto;
  47.                     width:auto;
  48.                     height:auto;
  49.                     position:absolute;
  50.                     width:600px;
  51.                 }
  52.                 #submenu a{
  53.                     display:block;
  54.                 }
  55.                 
  56.                 #submenu li ul li a:hover{
  57.                     background-color:#fff;
  58.                     color:#78bfeb;
  59.                     float:left
  60.                 }
  61.                 
  62.                 #submenu li{
  63.                     float:left;
  64.                     position:relative;
  65.                 }
  66.                 
  67.                 #submenu li ul a{
  68.                     border-top:1px #fff solid;
  69.                     border-bottom:1px #fff solid;
  70.                 }
  71.                 
  72.                 #submenu ul ul{
  73.                     top:auto;
  74.                 }
  75.                 
  76.                 #submenu li ul ul {
  77.                     top:20px;
  78.                     left:-10px;
  79.                     width:600px;
  80.                     margin:0px 0 0 10px;
  81.                 }
  82.                 
  83.                 #submenu li ul ul li {
  84.                     position:relative;
  85.                     float:left;
  86.                 }
  87.                 
  88.                 #submenu li ul ul li a{
  89.                     position:relative;
  90.                     float:left;
  91.                     display:inherit;
  92.                 }
  93.                 
  94.                 #submenu li:hover ul ul, #submenu li:hover ul ul ul, #submenu li:hover ul ul ul ul{
  95.                     display:none;
  96.                 }
  97.                 
  98.                 
  99.                 #submenu li:hover ul, #submenu li li:hover ul, #submenu li li li:hover ul, #submenu li li li li:hover ul{
  100.                     display:block;
  101.                 }

Y por ultimo el html
Código HTML: 
Ver original
  1. <ul id='submenu' class=''>
  2. <li>
  3.  <a href='contenido.php?menu=23' alt='nTransporte' class='prod_nTransporte'>nTransporte</a>
  4. <ul><li><a href='#'>nTransporte</a>
  5. <ul>
  6. <li><a href='contenido.php?menu=23&tpo=5&cont=92&item=17'>registrador</a></li>
  7. <li><a href='contenido.php?menu=23&tpo=5&cont=92&item=18'>veloc&iacute;metro</a></li>
  8. <li><a href='contenido.php?menu=23&tpo=5&cont=92&item=19'>sdi</a></li>
  9. <li><a href='contenido.php?menu=23&tpo=5&cont=92&item=20'>sensor</a></li>
  10. <li><a href='contenido.php?menu=23&tpo=5&cont=92&item=21'>convertidor</a></li>
  11. <li><a href='contenido.php?menu=23&tpo=5&cont=92&item=22'>audio y video</a></li>
  12. </ul>
  13. </ul>
  14. </li>
  15. <li>
  16.  <a href='contenido.php?menu=24' alt='nTPCB' class='prod_nTPCB'>nTPCB</a>
  17. <ul><li><a href='#'>nTPCBs</a>
  18. <ul>
  19. <li><a href='contenido.php?menu=24&tpo=5&cont=98&item=24'>ntpcbs</a></li>
  20. <li><a href='contenido.php?menu=24&tpo=5&cont=98&item=25'>formatos</a></li>
  21. <li><a href='contenido.php?menu=24&tpo=5&cont=98&item=26'>especificaciones</a></li>
  22. </ul>
  23. </ul>
  24. </li>
  25. <li>
  26.  <a href='contenido.php?menu=25' alt='nTSistemas' class='prod_nTSistemas'>nTSistemas</a>
  27. <ul><li><a href='#'>Letreros M&oacute;viles</a>
  28. <ul>
  29. <li><a href='contenido.php?menu=25&tpo=5&cont=89&item=6'>minipix</a></li>
  30. <li><a href='contenido.php?menu=25&tpo=5&cont=89&item=7'>clock</a></li>
  31. </ul>
  32. <li><a href='#'>Letreros Fijos</a>
  33. <ul>
  34. <li><a href='contenido.php?menu=25&tpo=5&cont=90&item=8'>fijos</a></li>
  35. </ul>
  36. </ul>
  37. </li>
  38. <li>
  39.  <a href='contenido.php?menu=26' alt='Minipix' class='prod_Minipix'>Minipix</a>
  40. <ul><li><a href='#'>Pantallas</a>
  41. <ul>
  42. <li><a href='contenido.php?menu=26&tpo=5&cont=35&item=1'>nanopix-2</a></li>
  43. <li><a href='contenido.php?menu=26&tpo=5&cont=35&item=2'>nanopix-4</a></li>
  44. <li><a href='contenido.php?menu=26&tpo=5&cont=35&item=3'>nanopix-8</a></li>
  45. <li><a href='contenido.php?menu=26&tpo=5&cont=35&item=4'>nanopix-16</a></li>
  46. <li><a href='contenido.php?menu=26&tpo=5&cont=35&item=12'>multil&iacute;nea</a></li>
  47. <li><a href='contenido.php?menu=26&tpo=5&cont=35&item=13'>especiales</a></li>
  48. </ul>
  49. <li><a href='#'>Relojes</a>
  50. <ul>
  51. <li><a href='contenido.php?menu=26&tpo=5&cont=37&item=5'>mp100</a></li>
  52. <li><a href='contenido.php?menu=26&tpo=5&cont=37&item=9'>mp200</a></li>
  53. <li><a href='contenido.php?menu=26&tpo=5&cont=37&item=10'>mp300</a></li>
  54. <li><a href='contenido.php?menu=26&tpo=5&cont=37&item=11'>especiales</a></li>
  55. </ul>
  56. <li><a href='#'>Tableros</a>
  57. <ul>
  58. <li><a href='contenido.php?menu=26&tpo=5&cont=91&item=14'>industriales</a></li>
  59. <li><a href='contenido.php?menu=26&tpo=5&cont=91&item=15'>divisas</a></li>
  60. <li><a href='contenido.php?menu=26&tpo=5&cont=91&item=16'>deportivos</a></li>
  61. </ul>
  62. </ul>
  63. </li>
  64. </ul>