tengo una pagina con un menu "ul" y submenus dentro de cada "li".
Cuando pulso sobre un titulo aparece el submenu mediante un "onclick" que llama a una funcion javascript.
A esta función le paso el id del bloque a mostrar y el value del bloque, si esta en on=visible o en off=oculto.
En la función tengo puesto un alert que me devuelve el value del bloque que le envio.
Al pulsar una vez nada más cargar la página el value es "undefined" la segunda vez que pulso ya devuelve el valor "on" o "off", me da la impresión que es como si no tubiera toda la página cargada.
Este es el código que tengo:
Código PHP:
<html>
<head>
<title>Untitled</title>
</head>
<style type="text/css">
<!--
#Titulos{
/* list-style-image:none;*/
list-style-type:none;
/* list-style-image:URL(images/flecha.png);*/
}
/* oculto los subtitulos */
.subtitulos{
display: none;
list-style-image:none;
list-style-type:none;
}
.Titulos1{
list-style-image:URL(images/flecha.png);
}
-->
</style>
<script type="text/javascript">
// definiciones basicas
OCULTO="none";
VISIBLE="block";
function cargar(){
var lis = document.getElementById("Titulos");
for (var i=0; i<lis.length; i++) {
lis[i].style.listStyleImage = "url('images/flecha.png')";
}
return true;
}
function mostrar(blo,titulo) {
alert(document.getElementById(blo).value);
if (document.getElementById(blo).value=="off"){
//muestroel bloque
document.getElementById(blo).style.display=VISIBLE;
// cambio la flecha
document.getElementById(titulo).style.listStyleImage = "url('images/flecha_abj.png')";
document.getElementById(blo).value="on";
}
else{
// oculto el bloque
document.getElementById(blo).style.display=OCULTO;
//cambio la flecha
document.getElementById(titulo).style.listStyleImage = "url('images/flecha.png')";
document.getElementById(blo).value="off";
return true;
}
}
function raton(){
//alert("aki");
document.body.style.cursor="pointer";
return true;
}
</script>
<body >
<div class="menu_izq" id="menu_izq">
<div class="menu" id="menu">
<ul class="Titulos" id="Titulos1">
<li class="Titulos1" id="Titulo1">
<a id="ver_on" onmouseover ="raton()" onclick="mostrar('subtitulo1','Titulo1')">Titulo1</a>
<ul class="subtitulos" id="subtitulo1" value="off">
<li class="Titulos2">
<a href="#">Archivos</a>
</li>
<li class="Titulos2">
<a href="#" >BlogRoll</a>
</li>
<li class="Titulos2">
<a href="#" >Enlaces</a>
</li>
<li class="Titulos2">
<a href="#" >Contacto</a>
</li>
<li class="Titulos2">
<a href="#">Más cosas</a>
</li>
</ul>
</li>
<li class="Titulos1" id="Titulo2">
<a id="ver_on" onclick="mostrar('bloque2','Titulo2')">Titulo2</a>
</li>
</ul>
</div>
<div class="datos">
<ul class="Titulos" id="Titulos2">
<li class="Titulos1" id="Titulo1_1">
<a id="ver_on" onmouseover ="raton()" onclick="mostrar('subtitulo1_1','Titulo1_1')">Titulo1</a>
<ul class="subtitulos" id="subtitulo1_1" value="off">
<li class="Titulos2">
<a href="#">Archivos</a>
</li>
<li class="Titulos3">
<a href="#" >BlogRoll</a>
</li>
<li class="Titulos3">
<a href="#" >Enlaces</a>
</li>
<li class="Titulos3">
<a href="#" >Contacto</a>
</li>
<li class="Titulos3">
<a href="#">Más cosas</a>
</li>
</ul>
</li>
<li class="Titulos1" id="Titulo3">
<a id="ver_on" onclick="mostrar('bloque2','Titulo2')">Titulo2</a>
</li>
</ul>
</div>
</div>
</body>
</html>
Alguna idea por que pasa esto????
Salu2
