... Tranquis lynxstyle .. eso ya se hizo. Ahora te explico porque la necesidad de hacer funcionar el menu en explorer 6 ... Ahi gran porcentaje de usuarios que aun usan explorer 6 y mas del 85% usan explorer sea 6,7 u 8 eso es una realidad y asi sea malo es el que usa el usuario comun. La mayoria de los usuarios que visitan nuestro portal no son programadores, ni tecnicos etc ... muchos de ellos ni siquiera tienen un nivel de conocimiento minimo para realizar actualizaciones en su pc ... Por tal motivo el sitio debe realizarce de tal forma que trabaje sin problema en la mayoria de navegadores .. y mas aun en internet explorer siendo este el navegador mas usado en el mundo.
Ubicar procesos de actualizacion... etc en la pagina para que el usuario realice es pedirles mucho .... por eso procuro probrar y usar codigo que en su totalidad no ocasione trabajo extra ...
Un usuario que se retira del portal por poblemas de navegacion o actualizaciones es dinero $$$$ que posiblemente perdido ...
Bueno esa es mi apreciacion ...
Aqui les dejo el codigo por si alguien lo requiere
el menu.php
Código PHP:
<!--[if IE 6]>
<script type="text/javascript">
/*Load jQuery if not already loaded*/ if(typeof jQuery == 'undefined'){ document.write("<script type=\"text/javascript\" src=\"http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js\"></"+"script>"); var __noconflict = true; }
var IE6UPDATE_OPTIONS = {
icons_path: "css/ie6update/images/"
}
</script>
<script type="text/javascript" src="css/ie6update/ie6update.js"></script>
<![endif]-->
<!--[if IE]><style>#menu ul li ul li a{margin-bottom:-1px;border-top-color: #fff;} #menu ul.nivel2{margin-top: -1px;}</style><![endif]-->
<!--[if IE 7]><style>#menu ul li ul li.nivel2:hover{margin-bottom:-2px;}</style><![endif]-->
<div id="menu">
<ul>
<li class="nivel1"><a href="#" class="nivel1">Especialistas</a>
<!--[if lte IE 6]><a href="#" class="nivel1ie">Especialistas<table class="falsa"><tr><td><![endif]-->
<ul class="nivel2">
<li><a href="index.php"> Especialistas en Colombia</a></li>
<li><a href="indexadd_especialistas.php?idc=1"> Bogota</a></li>
</ul>
<!--[if lte IE 6]></td></tr></table></a><![endif]-->
</li>
<li class="nivel1"><a href="#" class="nivel1">Clinicas</a>
<!--[if lte IE 6]><a href="#" class="nivel1ie">Clinicas<table class="falsa"><tr><td><![endif]-->
<ul class="nivel2">
<li><a href="indexadd_clinicas.php"> Clinicas en Colombia</a></li>
<li><a href="index_clinicas.php?idc=4"> Armenia</a></li>
<li><a href="index_clinicas.php?idc=6"> Barranquilla</a></li>
<li><a href="index_clinicas.php?idc=1"> Bogota</a></li>
<li><a href="index_clinicas.php?idc=2"> Cali</a></li>
<li><a href="index_clinicas.php?idc=5"> Cartagena</a></li>
<li><a href="index_clinicas.php?idc=3"> Medellin</a></li>
<li><a href="index_clinicas.php?idc=17"> Pereira</a></li>
<li><a href="index_clinicas.php?idc=18"> Popayan</a></li>
</ul>
<!--[if lte IE 6]></td></tr></table></a><![endif]-->
</li>
<li class="nivel1"><a href="#" class="nivel1">Hospedaje</a>
<!--[if lte IE 6]><a href="#" class="nivel1ie">Hospedaje<table class="falsa"><tr><td><![endif]-->
<ul class="nivel2">
<li><a href="indexadd_hoteles.php"> Hoteles en Colombia</a></li>
<li><a href="index_hoteles.php?idc=4"> Armenia</a></li>
<li><a href="index_hoteles.php?idc=6"> Barranquilla</a></li>
<li><a href="index_hoteles.php?idc=1"> Bogota</a></li>
<li><a href="index_hoteles.php?idc=2"> Cali</a></li>
<li><a href="index_hoteles.php?idc=5"> Cartagena</a></li>
<li><a href="index_hoteles.php?idc=3"> Medellin</a></li>
<li><a href="index_hoteles.php?idc=17"> Pereira</a></li>
<li><a href="index_hoteles.php?idc=18"> Popayan</a></li>
</ul>
<!--[if lte IE 6]></td></tr></table></a><![endif]-->
</li>
<li class="nivel1"><a href="javascript:abrir_vent_aerolineas();" class="nivel1">Aerolineas</a>
<!--[if lte IE 6]><a href="javascript:abrir_vent_aerolineas();" class="nivel1ie">Aerolineas<table class="falsa"><tr><td><![endif]-->
<!--[if lte IE 6]></td></tr></table></a><![endif]-->
</li>
<li class="nivel1"><a href="pagina_enconstruccion.php" class="nivel1">Otros</a>
<!--[if lte IE 6]><a href="pagina_enconstruccion.php" class="nivel1ie">Otros<table class="falsa"><tr><td><![endif]-->
<!--[if lte IE 6]></td></tr></table></a><![endif]-->
</li>
</ul>
</div>
css
Código PHP:
* { margin: center;
padding:0 0 0px 0; outline: 0;
}
html, body {
width: 100%;
}
body {
background: #366;
font-family: Verdana, Arial, Helvetica, sans-serif;
}
#menu {
z-index: 999;
text-align: left;
font-size: 1.0em;
width: 940px;
margin: 0px auto;
}
#menu ul {
list-style-type: none;
margin: 0;
margin-left: 0; /*offset of first tab relative to page left edge*/
}
#menu ul li {
width: 187px;
}
#menu ul li.nivel1 {
z-index: 999;
float: left;
width: 187px;
margin-right: 1px;
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 10px;
}
#menu ul li a {
z-index: 999;
display: block;
text-decoration: none;
color: #fff;
background: url(menu_estado1.png) no-repeat center left; /*custom bullet list image*/
/*background-color: #399;*/
border: solid 0px #fff;
padding: 3px;
position: relative;
}
#menu ul li a.nivel2, #menu ul li a.nivel2ie {
color: #000;
}
#menu ul li a.nivel1, #menu ul li a.nivel2 {
display: block!important;display: none;
position: relative;
}
#menu ul li:hover {
position: relative;
}
#menu ul li a:hover, #menu ul li:hover a.nivel1 {
background: url(menu_estado2.png) no-repeat; /*custom bullet list image*/
/*background-color: #6CC;*/
color: #fff;
position: relative;
}
#menu ul li ul {
margin:0px 0 0 -1px; *margin:0 0 0 0; clear:both; font-weight:normal;left:-999em; position:absolute; width:187px; z-index:999; background:url(remate_desplegable.png) no-repeat bottom left; padding:0 0 5px 0;
}
#menu ul li:hover ul.nivel2, #menu ul li a:hover ul.nivel2{
display: block;
position: absolute;left: 0px;
}
#menu ul li ul li a:hover ul.nivel3, #menu ul li ul li:hover ul.nivel3 {
display: block;
position: absolute;
left: 188px!important;left: 187px;
top:0px!important;top: -21px;
}
#menu ul li ul li a {
width: 187px;
padding: 3px 0px 3px 0px;
border-top-color: transparent;
}
#menu ul li ul li a:hover {
border-top-color: #000;
position: relative;
}
#menu ul li ul li ul li a.primera {
border-top-color: #fff;
}
table.falsa {
border-collapse:collapse;
border:0px;
float: left;
position: relative;
}
Nuevamente -- gracias foros del web ..