Hola [EMAIL PROTECTED],
Estoy intentando adaptar el menú que aparece en la página
http://tutorials.alsacreations.com/deroulant/menu-vertical.htm para mi Web. En
internet explorer funciona correctamente, el problema me lo encuentro cuando
veo la página con Firefox. Es una cosa muy curiosa, tengo una capa #menu en mi
código donde tengo las listas que conforman dicho menú. Esa capa tiene posicion
absoluta top:160px y left:35px entre otras cosas. La cosas es que si le pongo
top:0 left:0 funciona correctamente, en cuanto muevo el menú no me funciona
correctamente. Probé a cambiar los valores de top y left del ejemplo de la Web
que os mencioné anteriormente y funciona perfecto, estoy dando vueltas y no veo
una solución, os escribo el código para ver si a alguien le pasó lo mismo que a
mi porque no hago más que dar vueltas y acabo en el mismo sitio donde empecé.
El código del menú de mi página es:
<div id="menu">
<h3>Menú</h3>
<ul>
<li><a href="#">Menu 1</a></li>
<li onclick="javascript:montre('smenu2');">Menu 2
<ul id="smenu2">
<li><a href="#">Sous-Menu 2.1</a></li>
<li><a href="#">Sous-Menu 2.2</a></li>
<li><a href="#">Sous-Menu 2.3</a></li>
</ul></li>
<li onclick="javascript:montre('smenu3');">Menu 3
<ul id="smenu3">
<li><a href="#">Sous-Menu 3.1</a></li>
<li><a href="#">Sous-Menu 3.1</a></li>
<li><a href="#">Sous-Menu 3.1</a></li>
<li><a href="#">Sous-Menu 3.1</a></li>
<li><a href="#">Sous-Menu 3.1</a></li>
<li><a href="#">Sous-Menu 3.1</a></li>
</ul></li>
<li onclick="javascript:montre('smenu4');">Menu 4
<ul id="smenu4">
<li><a href="#">Sous-Menu 4.1</a></li>
<li><a href="#">Sous-Menu 4.1</a></li>
</ul></li>
<li onclick="javascript:montre('smenu5');">Menu 5
<ul id="smenu5">
<li><a href="#">Sous-Menu 4.1</a></li>
<li><a href="#">Sous-Menu 4.1</a></li>
</ul></li>
</ul>
</div>
El código CSS de ese menú es el siguiente:
#menu {
position: absolute;
top:160px;
left:35px;
width:180px;
color:#000;
background-color:inherit;
background: url(images/menu_fin.gif) bottom center no-repeat;
padding:0 0 21px 0;
}
#menu h3 {
margin:0; padding:0; border:0;
text-indent:-99999px;
color:#309;
background-color:inherit;
background: url(images/menu.gif) top center no-repeat;
width:180px;
height:33px;
}
#menu ul {
color:#000;
background-color: #D6E4D6;
margin:0; padding:0px; border:0;
list-style:none;
}
#menu li {
font-size:0.90em;
text-indent:20px;
border-bottom: 1px #C5C5C5 dotted;
padding: 3px 0 3px 0;
cursor:pointer;
}
#menu ul ul {
color:#000;
background:#F7F7F7;
margin:0; padding:0; border:0;
list-style:none;
display:none;
}
#menu ul ul li {
color:#000;
background:#F7F7F7;
border:0; padding:0; border:0;
text-indent:10px;
}
El código Javascript es:
<script type="text/javascript">
<!--
window.onload=montre;
function montre(id) {
var d = document.getElementById(id);
for (var i = 1; i<=10; i++) {
if (document.getElementById('smenu'+i))
{document.getElementById('smenu'+i).style.display='none';}
}
if (d) {d.style.display='block';}
}
//-->
</script>
Un saludo,
Nacho
_______________________________________________
Lista de distribución Ovillo
Para escribir a la lista, envia un correo a [email protected]
Puedes modificar tus datos o desuscribirte en la siguiente dirección:
http://ovillo.org/mailman/listinfo/ovillo
