title: issue when fixing element to top
body: <p>I'm adding a few new features into a friend of mines website, which is already built. He wants a a div, which is a little bit bellow the header, to be locked to the screen as soon a the user scrolls to the top of it. I created the function bellow which works just fine, but as soon as jquery places the element in a fixed position, all of the elements bellow it slide up causing the entire site to "jump". Is there a way to prevent this from happening without placing all of these elements in an absolute position? This website is pretty involved and will take a lot to redo all of these elements.</p>
  
  <pre><code>jQuery(function($) {
      function lockelem() {
  
          if ($(window).scrollTop() &gt; 786) 
            $('.tabs').css({'z-index': '10000', 'position': 'fixed', 'top': '-200px', 'width': '100%'}); 
          else
            $('.tabs').css({'position': 'relative', 'top': 'auto'});
          }
  
     $(window).scroll(lockelem);
     lockelem();
  });
  </code></pre>
  
  <p>Any suggestions would be greatly appreciated!</p>