Duda con mostrar/ocultar capas

hgp147 · #1 (**permalink**) 11/02/2008, 14:44

Hola, con el código de abajo que encontre en este foro, logro que se muestren y oculten las capas. Lo que quiero es que por defecto al entrar a la página me muestre una de las capas, esto lo logre reemplzando en el código de abajo esto:
<div id="capa1" style="display:none">Capa 1</div> por esto: <div id="capa1" style="display:block">Capa 1</div>.
El problema es que si luego hago click en el link de capa2, quedan visibles las dos capas, cuando tendría que verse solo la 2 y ocultarse la capa1.

Código HTML:

<html>
<head>
<script>
var vista = null;
function ver(ide) {
  obj = document.getElementById(ide);
  obj.style.display = 'block';
  if (vista!=null && vista!=obj)
    vista.style.display = 'none';
  vista = obj;
}
</script>
</head>
<body onload="ver('capa2')">
<a href="#" onclick="ver('capa1'); return false">Capa 1</a>
<a href="#" onclick="ver('capa2'); return false">Capa 2</a>
<div id="capa1" style="display:none">Capa 1</div>
<div id="capa2" style="display:none">Capa 2</div>
</body>
</html>

Gracias

KarlanKas · #2 (**permalink**) 11/02/2008, 16:49

Cambia:
var vista = null;

por:

var vista = document.getElementById("capa1");

Y ya está!

NO!

Mejor cambia:

<body onload="ver('capa2')">

por:

<body onload="ver('capa1')">

Y deja los display tal y como estaban (los dos none).

caricatos · #3 (**permalink**) 11/02/2008, 17:03

Hola:

¡Qué poco me gusta ver enlaces (tags a) para no enlazar...!, por cierto, el código parece del estilo de Javi

Con unos retoques (a mi gusto):

Código:

<html>
<head>
<script>
var oculta = "capa2";
function ver(ide) {
document.getElementById(oculta).style.display = "none";
oculta = ide;
document.getElementById(oculta).style.display = "block";
}
</script>
</head>
<body >
<span onclick="ver('capa1')" style="cursor: pointer; color: blue">Capa 1</span>
<span onclick="ver('capa2')" style="cursor: pointer; color: blue">Capa 2</span>
<div id="capa1" style="display:none">Capa 1</div>
<div id="capa2" >Capa 2</div>
</body>
</html>

Saludos

hgp147 · #4 (**permalink**) 11/02/2008, 17:54

Hola KarlanKas y caricatos muchas gracias por su ayuda!!!!! Funciona perfecto los dos códigos.

KarlanKas · #5 (**permalink**) 12/02/2008, 01:22

Me alegro de que te funcionara!