Ver Mensaje Individual
  #6 (permalink)  
Antiguo 11/07/2007, 10:51
Avatar de caricatos
caricatos
Moderador
 
Fecha de Ingreso: abril-2002
Ubicación: Torremolinos (Málaga)
Mensajes: 19.607
Antigüedad: 22 años, 11 meses
Puntos: 1284
Re: Hacer visible un div de forma animada?

Hola:

La verdad es que el código que pensaba era algo más sencillo:

Código:
<html>
<head>
<title>
	efecto
</title>
<script type="text/javascript">
function tag(id) {
 return document.getElementById(id);
}
function ocultar(que) {
 tope = parseInt(tag(que).style.top);
 papi = parseInt(tag(que).parentNode.style.height);
 tag(que).style.top = ++tope + "px";
 if (tope == papi) {
   tag("ocultar").disabled = true;
   tag("mostrar").disabled = false;
 }
 else
  setTimeout("ocultar('" + que + "')", 10);
}
function mostrar(que) {
 tope = parseInt(tag(que).style.top);
 papi = parseInt(tag(que).parentNode.style.height);
 tag(que).style.top = --tope + "px";
 if (tope == 0) {
   tag("ocultar").disabled = false;
   tag("mostrar").disabled = true;
 }
 else
  setTimeout("mostrar('" + que + "')", 10);
}
</script>
</head>
<body >
<div id="contenedor" style="position: relative; height: 120px; width: 120px; overflow: hidden">
<div id="azul" style="width: 120px; height: 120px; background-color: blue; position: absolute; top: 0; left: 0; ">Esta capa se mostrará y se ocultará...</div>
</div>
<button id="ocultar" onclick="ocultar('azul')" >ocultar</button>
<button id="mostrar" onclick="mostrar('azul')" disabled >mostrar</button>
</body>
</html>
Saludos
__________________
Por favor:
No hagan preguntas de temas de foros en mensajes privados... no las respondo