Muchas gracias!!
Ya daba el tema por perdido, pero he revisado mis temas y vi todas esas respuestas.
Muchas gracias.
Me quedo con el ejemplo e investigaré todo para poder hacerlo yo solo, que es lo que interesa.
Edito:
He hecho un código que lo abre y una vez abierto muestra la opción cerrar... Gracias a vuestra ayuda he aprendido algo más
Código javascript
:
Ver original<html>
<head>
<script type="text/javaSCript">
var width=100;
var inter;
function ampliar(){
inter = setInterval(amplia,5);
}
function amplia(){
if(width<=500){
width+=10;
document.getElementById('x').style.width=width+'px';
}
else{
clearInterval(inter);
document.getElementById('link').innerHTML='<a href="javascript:cerrar()">Cerrar</a>';
}
}
//Cerrar
function cerrar(){
intercierra = setInterval(cierra,5);
}
function cierra(){
if(width>=100){
width-=10;
document.getElementById('x').style.width=width+'px';
}
else{
clearInterval(intercierra);
document.getElementById('link').innerHTML='<a href="javascript:ampliar()">Ampliar</a>';
}
}
</script>
</head>
<body>
<div id="link">
<a href="javascript:ampliar()">Ampliar</a>
</div>
<div id="x" style="width:100px;height:100px;border:solid 1px black">
</div>
</body>
</html>
(Jaja)
Ya que pregunté, quiero dejar algo más..
Si añadimos esta línea:
document.getElementById('x').style.height=width+'p x';
debajo de
document.getElementById('x').style.width=width+'px ';
...se nos ampliará de manera diagonal, es decir, también crecerá el alto... (Ten en cuenta agregar esta línea en las dos funciones, amplia y cierra, para que también se efectúe al cerrar)