Hola a todos, tengo el siguiente inconveniente, con JavaScript no puedo acceder a las propiedades de style.visibility ni style.display de la hoja de estilos CSS. por ejemplo:
en el CSS tengo algo así:
Código:
#contenedor{visibility:hidden; width:100%; heigth:100%; background:blue;}
en el JS tengo una función asi:
Código:
function visibles()
{
var current = document.getElementById("contenedor").style.visibility;
if( current == "visible" )
{
document.getElementById("contenedor").style.visibility= "hidden";
}
else
{
document.getElementById("contenedor").style.visibility= "visible";
}
}
en el HTML tengo algo asi:
<div id="contenedor">algún contendio</div>
<p onclick="visibles()">Haz clic para ver contenido</p>
Cuando hago un clic al P este llama a la función visibles(), pero no hace nada, recién al segundo clic se realiza la función de mostrar el contenedor, es decir, JavaScript no puede encontrar el estado de visibilidad del contenedor al llamar por primera vez a la función.
Lo extraño es que si en el HTML yo agrego el style, la función se ejecuta correctamente, es decir, si coloco esto en el HTML <div id="contenedor" style="visibility:hidden;">algún contenido</div> al hacer el primer clic al P, JavaScript resuelve sin problemas el estado de visibilidad del contenedor.
Esto me lleva a suponer que por algún motivo JavaScript no puede resolver el estado de visibilidad o de display de los elementos del DOM que obtengan sus estilos del CSS.
Ya he comprobado con http://validator.w3.org/ el código HTML, con http://jigsaw.w3.org/css-validator/ el código CSS y con Firebug de Firefox el código JS y todo esta perfecto, no hay ningún error, la consola no muestra ningún error, es totalmente extraño.
por ejemplo, si agrego esta función al JS con un alert, al iniciar el sitio me devuelve vacio pero sin ningún error, la función seria
Código:
window.onload = function(){ alert(document.getElementById('contenedor').style.visibility)}
Es un error muy extraño y muy difícil de expresar, sepan disculpar.
Desde ya muchas gracias!