title: Jquery to slide in div in from right, and slide out old div to left of screen
body: <p>I have 2 divs that contain 2 screens of information.</p>
  
  <pre><code>&lt;--    &lt;div id="div1"&gt;    |    &lt;--    &lt;div id="div2"&gt;
  </code></pre>
  
  <p>I want to replicate the movement that is used in some apps. Namely #div1 is shown on screen, however when a button is clicked #div2 takes its place sliding in from the right whilst #div1 slides out to the left. A button on #div2 reverses the layout back.</p>
  
  <p>I'm not a css or jquery guy but i'm pretty sure this is achievable and within my capabilities with a little advice. This could possible even be done with pure CSS.</p>
  
  <p>Can anyone help? </p>