title: jQuery: toggle a <div> to it's original position as stated on the divs ID in CSS
body: <p>I have several divs with the class "itemWerk". I wish to toggle them, so that i can enlarge them and set them back to the original size and position.</p>
  
  <p>I've come quite far as you can see over <a href="http://casperjonker.site50.net/MijnWerk.html" rel="nofollow">here</a>. It's just the positioning in my second function i can't get to work. I'm not really sure what i should use: .position or .offSet or .data... Seen several guides that sort of explain what i'm looking for but can't get it to work.</p>
  
  <p>Here is my jQuery code:</p>
  
  <pre><code>$('.itemWerk').toggle(
  
  function(){
  
      $(this)
          .animate({'z-index':'10'}, { duration: 0, queue: false })
          .animate({'left':'0.5em'}, { duration: 400, queue: false })
          .animate({'top':'0.5em'}, { duration: 400, queue: false })
          .animate({'width':'74em'}, { duration: 400, queue: false })
          .animate({'height': '53em'}, { duration: 400, queue: false })
  
      $("#achtergrondWerk")
          .animate({'height':'54em'},{ duration: 400, queue: false }) 
  ;},
  
  function(){
  
      $(this)
          .animate({'left':'postion.left'}, { duration: 400, queue: false })
          .animate({'top':'position.top'}, { duration: 400, queue: false })
          .animate({'width':'10em'}, { duration: 400, queue: false })
          .animate({'height': '16em'}, { duration: 400, queue: false })
  
      $("#achtergrondWerk")
          .animate({'height':'38em'},{ duration: 400, queue: false }) 
  });
  </code></pre>
  
  <p>Here is one of the divs in the HTML document:</p>
  
  <pre><code>&lt;div class="itemWerk" id="werkEen"&gt;
  
  
  
  &lt;/div&gt;
  </code></pre>
  
  <p>And here is the CSS code for the class .itemWerk</p>
  
  <pre><code>.itemWerk {
  width: 10em;
  height: 16em;
  background: white;
  float: left;
  overflow: hidden;
  white-space: nowrap;
  cursor: pointer;
  }
  </code></pre>
  
  <p>and the ID #werkEen</p>
  
  <pre><code>#werkEen {
  position: absolute;
  top: 2em;
  left: 2em;
  }
  </code></pre>