expand a certain div while hiding another div

[geekisthenewsexy]

hi guys. how do you expand or maximize a certain div while sort of hiding another div (in this case, a control panel) all in one click of a button or link? :-\

[geekisthenewsexy]

hi, thought i'd include the html..

 

this is the div i wanted to expand to the right

 
<div  style="margin-right: 230px;" id="content"> 
		   <ul class="tabs">
		   <a class="menuitem submenuheader" href="#sy"> schoolyear</a>
		   </ul>
   <div id="sy" class="submenu">
            <iframe src ="_admin_sy.php" border="0">
               <p>Your browser does not support iframes.</p>
            </iframe>
				</div>

		  <p />
		  
		   <ul class="tabs">
		   <a class="menuitem submenuheader" href="#cbr"> course | block | room</a>
		   </ul>
   <div id="cbr" class="submenu">
            <iframe src ="TinyTableV3/index.php" border="0">
               <p>Your browser does not support iframes.</p>
            </iframe>
				</div>


            </div>

 

and this is the other div i want to hide when i click on "Hide"

        <div id="sidebar" class="side">
		<a id="animation2" style="opacity: 1;" class="trigger" href="#"></a>
		<div style="opacity: 1; right: 0px;" class="slide">

  				<ul>
                	<li><h3><a href="#" class="house">Dashboard</a></h3>
                        <ul>
                        	<li><a href="#" class="admin">My profile</a></li>
                    		<li><a href="#" class="report_seo">Account settings</a></li>
                            <li><a href="#" class="logout">Logout</a></li>
                        
                        </ul>
                    </li>
                    <li><h3><a href="#" class="folder_table">Orders</a></h3>
          				<ul>
                        	<li><a href="#" class="addorder">New order</a></li>
                          <li><a href="#" class="shipping">Shipments</a></li>
                            <li><a href="#" class="invoices">Invoices</a></li>
                        </ul>
                    </li>
                    <li><h3><a href="#" class="manage">Manage</a></h3>
          				<ul>
                            <li><a href="#" class="manage_page">Pages</a></li>
                            <li><a href="#" class="cart">Products</a></li>
                            <li><a href="#" class="folder">Product categories</a></li>
            				<li><a href="#" class="promotions">Promotions</a></li>
                        </ul>
                    </li>
                  <li><h3><a href="#" class="user">Users</a></h3>
          				<ul>
                            <li><a href="#" class="useradd">Add user</a></li>
                            <li><a href="#" class="group">User groups</a></li>
            				<li><a href="#" class="search">Find user</a></li>
                            <li><a href="#" class="online">Users online</a></li>
                        </ul>
                    </li>
			</ul>   
</div>				
          </div>

..help..anyone?? :'(