Minimise / maximise a div

I ve created a chat appliction in one DIV. Now i need it to be placed in the bottom of page, which should be minimised & maximized Can any one help me

<div  style="height:40px;  width:300px;  background-color:#CC66FF; position:absolute;bottom:15px;"  >

<div id="vithu" style="height:40px;  width:200px;"></div>
<span id="error_msg"></span>
<table>
<form method="post">
<tr>
<td><input type="text" name="txt_msg_box" id="txt_msg_box" ></td>
<td><input type="button"  value="Chat开发者_StackOverflow" onClick="save_chat();"  /></td>
</tr>  
<input type="hidden" id="hdn_username" name="hdn_username" value="<?php echo  rand_str();?>" />
</form>
</table>
</div>

I assume you are looking for something like this... modal windows using prototype

Use the jQuery to set the display property of the div to none. Add "divNotDisplayed" class when you hide the div. If this class is present then alter the size of other divs. Add "divDisplayed" class when you display the div and once again alter other divs.

Udachi