ocultar y mostrar capa con un mismo boton

flashtkd · #1 (**permalink**) 27/10/2009, 09:52

Este código muestra la capa 2 al presionar el botón mostrar o oculta la capa 2 al presionar el botón ocultar

la consulta es: como se puede hacer esto mismo pero usando un solo botón. cuando cargue la pagina mantenga oculto, al presiona el botón lo muestra y al volver presionar el mismo botón lo oculta.

Código PHP:

  <html> 

<head> 

<title>Untitled</title> 

<script language="Javascript"> 

function mostrar(nombreCapa){ 

document.getElementById(nombreCapa).style.visibility="visible"; 

} 

function ocultar(nombreCapa){ 

document.getElementById(nombreCapa).style.visibility="hidden"; 

} 

</script> 

</head> 

<body> 

<div id="capa1"><input type="submit" value="mostrar" onclick="mostrar('capa2')">Capa 1</div>

<div id="capa1"><input type="submit" value="ocultar" onclick="ocultar('capa2')">Capa 1</div>

<div id="capa2" style="visibility:hidden">Capa 2 -contenido-</div> 

</body> 

</html>

David · #2 (**permalink**) 27/10/2009, 09:55

Algo así:

Código Javascript:

Ver originalvar elem = document.getElementById(nombreCapa);
elem.style.visibility = (elem.style.visibility == "hidden") ? "visible" : "hidden";