title: Div width expand/shrink on click
body: <p>For a site I'm making for myself and a friend, I have a div container/wrapper with 2 other divs within it: one occupies the left half and has a black background and the other occupies the right with a white background. Essentially, this lets me get a split colored background. Each div holds half of a logo. Here's the page, temporarily hosted so you guys can see it. <br><br>
  <a href="http://djsbydesign.com/tempsite/index.htm" rel="nofollow">http://djsbydesign.com/tempsite/index.htm</a></p>
  
  <p>At any rate, I'd like to have links on the left and right hand sides of the page that, on click, cause their respective divs to expand from 50% to 100%. I have a few ideas, but am not sure entirely how to go about doing this (I'm rather new to javascript). The first would be to have the expanding div's z-index set to something higher than the non-expanding one, and then have it expand (somehow), and the other is to have the expanding div expand to 100% while the other shrinks to 0% at an equal rate. </p>
  
  <p>The bottom line is, I have no idea how to go about doing this. I don't mind using mootools or jQuery, for the record. </p>