Capas CSS con javascript invisibles.

[NetJava]

Buenas,

Tengo un problema, en mi pag web tengo un menú y en función del botón que presione quiero que se hagan invisibles las capas que no corresponden y que se haga visible la que corresponde, la idea es que sea como una aplicación de ordenador.
Para ello estoy utilizando javascrip, lo había conseguido en su momento, era un proyecto olvidado... pero he perdido el código que hice en su momento XD.

Código [Seleccionar] Expandir


function VisibilidadCapas(String tipo = "") {
if(ocument.getElementById("PrincipalInicio").style == true){
document.getElementById("PrincipalInicio").style.visibility  = "visible";
document.getElementById("AltaLibros").style.visibility  = "hidden";
}
}


De javascrip no controlo mucho, se supone que tengo que identificar el id del div, y después hacer visible e invisible.
Me dais alguna pista XD. Saludos y gracias!!!

[moyo18]

proba esto.

Código [Seleccionar] Expandir


function VisibilidadCapas(String tipo = "") {
if(document.getElementById("PrincipalInicio").style == true){
document.getElementById("PrincipalInicio").style.display  = "block";
document.getElementById("AltaLibros").style.display  = "none";
}
}


podes poner none, block o inline.

Ademas le agregue d a ocument.getElementById, talvez eso t este dando un error.

[NetJava]

Buenas,
Ya he solucionado el problema, os lo dejo puesto, la idea es que según el botón que se presione desde la web se vayan cambiando las capas.

Código (javascript) [Seleccionar] Expandir


function show(item)
{
var PrincipalInicio=document.getElementById("PrincipalInicio")
var AltaLibros = document.getElementById("AltaLibros")
var BuscarLibros = document.getElementById("BuscarLibros")
var BajaLibros = document.getElementById("BajaLibros")
var RelacionarLibros = document.getElementById("RelacionarLibros")
var Clasificacion = document.getElementById("Clasificacion")
var Usuario = document.getElementById("Usuario")

if(item == 'PrincipalInicio')
{
PrincipalInicio.style.visibility='visible'
AltaLibros.style.visibility='hidden'
BuscarLibros.style.visibility='hidden'
BajaLibros.style.visibility='hidden'
RelacionarLibros.style.visibility='hidden'
Clasificacion.style.visibility='hidden'
Usuario.style.visibility='hidden'
}
if(item == 'AltaLibros')
{
AltaLibros.style.visibility='visible'
PrincipalInicio.style.visibility='hidden'
BuscarLibros.style.visibility='hidden'
   BajaLibros.style.visibility='hidden'
RelacionarLibros.style.visibility='hidden'
Clasificacion.style.visibility='hidden'
Usuario.style.visibility='hidden'
}
if(item == 'BuscarLibros')
{
BuscarLibros.style.visibility='visible'
PrincipalInicio.style.visibility='hidden'
AltaLibros.style.visibility='hidden'
BajaLibros.style.visibility='hidden'
RelacionarLibros.style.visibility='hidden'
Clasificacion.style.visibility='hidden'
Usuario.style.visibility='hidden'
}
if(item == 'BajaLibros')
{
BajaLibros.style.visibility='visible'
PrincipalInicio.style.visibility='hidden'
AltaLibros.style.visibility='hidden'
BuscarLibros.style.visibility='hidden'
RelacionarLibros.style.visibility='hidden'
Clasificacion.style.visibility='hidden'
Usuario.style.visibility='hidden'
}
if(item == 'RelacionarLibros')
{
RelacionarLibros.style.visibility='visible'
PrincipalInicio.style.visibility='hidden'
AltaLibros.style.visibility='hidden'
BuscarLibros.style.visibility='hidden'
BajaLibros.style.visibility='hidden'
Clasificacion.style.visibility='hidden'
Usuario.style.visibility='hidden'
}
if(item == 'Clasificacion')
{
Clasificacion.style.visibility='visible'
PrincipalInicio.style.visibility='hidden'
AltaLibros.style.visibility='hidden'
BuscarLibros.style.visibility='hidden'
BajaLibros.style.visibility='hidden'
RelacionarLibros.style.visibility='hidden'
Usuario.style.visibility='hidden'
}
if(item == 'Usuario')
{
Usuario.style.visibility='visible'
PrincipalInicio.style.visibility='hidden'
AltaLibros.style.visibility='hidden'
BuscarLibros.style.visibility='hidden'
BajaLibros.style.visibility='hidden'
RelacionarLibros.style.visibility='hidden'
Clasificacion.style.visibility='hidden'
}
}



Gracias por la respuesta, aunq era algo diferente al final, por lo menos lo que me salio claro. XD Saludos!!!

[Cicklow]

Con Jquery no es mas rapido y menos codigo?

Saludos

[NetJava]

jejejeje no lo se, soy novatillo en web... pero lo comprobaré XD Aunq no se a que nivel se puede medir la rapidez en este tema. Saludos!

[Cicklow]

Puedes usar la funcion Toggle de Jquery. o Show y Hide...

http://www.designgala.com/demos/collapse-expand-jquery.html
http://api.jquery.com/toggle/

[NetJava]

Lo he estado mirando y esta genial aunq me va a costar trabajar con las funciones... pero bueno, merecerá la pena supongo. Me he bajado la librería versión 1.3 creo que se ha llegado hasta la 1.6 (eso dice wiki). En la segunda url he mirado los ejemplos, y tira de http://code.jquery.com/jquery-latest.js, es lo mismo que descargar y utilizar la librería¿?¿?

Un saludo y gracias!!!