hola a todos, tengo un problemita que espero me puedan ayudar a resolver, eh buscado por google pero no logro encontrar la solucion, tengo una pagina con 4 frame y quiero poner un boton en cada uno de ellos y que al presionar este botón el frame se contraiga y al presionarlo nuevamente el frame se expanda, tal y como lo hace esta pagina al pinchar sobre el boton ">" Ver
tengo el siguiente codigo que hice en uno de mis frame, el que funciona siempre y cuando no se haya dimensionado el frame manualmente es decir que se pinche en el borde de frame y arrastrandolo expanda el tamaño del frame si hago eso ya deja de funcionar bien.
este es el codigo.

Código HTML :

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
 
<html>
<head>
<title>Untitled</title>

Código Javascript :

<script>
function cambiar(){
    var ancho=parent.document.getElementById('dos').width;
    alert(ancho);
if (ancho>20)
{
    top.document.getElementById('segundo').cols='20px,*,250px'
} 
if (ancho<=20)
{
    top.document.getElementById('segundo').cols='260,*,250'
}
 
}
</script>

Código HTML :

</head>
 
<body leftmargin="0" topmargin="0">
<div id="top" style="background:url(titulos_griilas.png)"><input type="button" onclick="cambiar(this)" value="Quitar"></div>
 
</body>
</html>

me podrían ayudar por favor me gustaría que quede como se ve la pagina del enlace que puse.