title: Slow reaction time of animate on $(window).scroll
body: <p>Here is an <a href="http://bramvanroy.be/webdevs/" rel="nofollow">example</a>. When you scroll down, the nav bar gets animated. When you scroll back to the top it should be animated back. Unfortunately, this happens <strong>very</strong> slow. This has porbably to do with the fact that every you scroll, the coordinates have to be checked and calculated. </p>
  
  <p>In other words, I am looking for a way to make this snippet more efficient:</p>
  
  <pre><code>$(window).scroll(function(){
      var supra = $("div#supra-top-wrap"),
          topWrap = supra.children("div#top-wrap"),
          subNav = supra.children("nav#sub-nav");
  
      if ($(window).scrollTop() &gt; 0){
          topWrap.animate({"top":"-38px"}, 400);
          subNav.animate({"top":"-70px"}, 400);
      }
      else {
          topWrap.animate({"top":"0"}, 400, function() {
              subNav.animate({"top":"0"}, 400);
          });
      }
  });
  </code></pre>
  
  <p>Oh, and here is a <a href="http://jsfiddle.net/BramVanroy/FrcjR/" rel="nofollow">Fiddle</a> to get your way with.</p>