Mostrar div con javascript

fedefrankk · #1 (**permalink**) 08/02/2011, 16:46

Buenas.!!!!, tengo un sencillo problema,

tengo dos div "num1" y otro "num2" este ultimo esta oculto.

quiero hacer una funcion que cuando aprieto el div "num1" aparezca el div "num2"

desde ya muchas gracias

saludos a todos

fede

PD: busque en google pero no funciona.

Código Javascript:

Ver original<script language="JavaScript">
function ocultar(num1)
{
      document.all[num1].style.visibility='hidden'; 
}
</script>

walterdevel · #2 (**permalink**) 08/02/2011, 17:21

Probá con esto:

Código Javascript:

Ver original<script language="JavaScript">
function toggle(opt)
{
if(opt == 1) {
  document.getElementById("num1").style.display='none'; 
  document.getElementById("num2").style.display=''; 
} else {
  document.getElementById("num2").style.display='none'; 
  document.getElementById("num1").style.display=''; 
}
 
}
</script>

en tu html:

Código HTML:

Ver original<div id="num1" onclick="toggle(2)"></div>
 
<div id="num2" style="display:none" onclick="toggle(1)"></div>

fedefrankk · #3 (**permalink**) 08/02/2011, 20:52

Buenas, gracias por tu tiempo..!!!, en algo fallo yo, no se bien como van los codigos, te muestro lo que hice, sale toda la pantalla en blanco.

Código HTML:

Ver original<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<div id="num1" onclick="toggle(2)"></div>
 
<div id="num2" style="display:none" onclick="toggle(1)"></div>
 
<script language="JavaScript">
function toggle(opt)
{
if(opt == 1) {
  document.getElementById("num1").style.display='none'; 
  document.getElementById("num2").style.display=''; 
} else {
  document.getElementById("num2").style.display='none'; 
  document.getElementById("num1").style.display=''; 
}
 
}
</script>
</head>
 
<body>

Saludos a todos
fede

walterdevel · #4 (**permalink**) 08/02/2011, 21:13

Claro, tus divs no tienen tamaño, ni background de color. Agregale algo de estilos y veras si funciona.

fedefrankk · #5 (**permalink**) 08/02/2011, 21:22

Hola, buenas, ok, entonces le pongo estilos, como fondo tipo de texto etc.
pruebo y te aviso

muchas gracias.!!!!

saludos
fede

fedefrankk · #6 (**permalink**) 08/02/2011, 21:49

hola de nuevo, y gracias nuevamente por tu tiempo,

hice esto le di estilos pero sale en blanco en que le estoy fallando?

Código HTML:

Ver original<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
 
<style type="text/css">
.num1 {
    background:#0F6;
    
}
.num2 {
    border:double:#F00;
    
    
}
</style>
</head>
 
 
<div id="num1" onclick="toggle(2)"></div>
 
<div id="num2" style="display:none" onclick="toggle(1)"></div>
<script language="JavaScript">
function toggle(opt)
{
if(opt == 1) {
  document.getElementById("num1").style.display='none'; 
  document.getElementById("num2").style.display=''; 
} else {
  document.getElementById("num2").style.display='none'; 
  document.getElementById("num1").style.display=''; 
}
 
}
</script>
 
 
<body>
</body>
</html>

Gracias y Saludos
fede

walterdevel · #7 (**permalink**) 08/02/2011, 22:06

Tenés que ponerle un width y un height a ambos divs