Salve a tutti, stavo facendo qualche esperimento, cioè, allungare un div al clik dell'utente, ma purtroppo si apre di botto, non saprei come rallentare, ho provato la funzione setTimeout() ma non riesco, mi dà un'errore che non riesco ad individuare..

il codice è questo:
Codice PHP:
<!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=iso-8859-1" />
<title>Prova</title>
<script type="text/javascript">
<!--
function allunga(id){
var box = document.getElementById(id);
setTimeout('allunga()',1000);
var x=1;
while(x<300){
box.style.height=x;
x++;
}
}
//-->
</script>
<style type="text/css">
<!--
#centro {
width: 500px;
margin-right: auto;
margin-left: auto;
border: thin solid #EAEAEA;
background-color: #393939;
color: #F9F9F9;
text-align: center;
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 12px;
padding: 5px;
}
-->
</style>
</head>
<body>
<div id="centro"><a onclick="allunga('centro')">centro</a></div>
</body>
</html> 
chi mi dà una mano a capire? grazie ^^