title: Div positioning fixed at margin-top:20px when scrolling up
body: <p>I have a div which I want to become fixed at 20px from the top of the window when you scroll up and 40px from the footer when you get the bottom. My code seems inconstant, there must be a better way? <a href="http://www.halogamertags.com/dachs" rel="nofollow">Page Link</a></p>
  
  <pre><code>$(document).scroll(function () {
          if($(window).scrollTop() &gt;= 345){
              $('#rightShipping').css({'position' : 'fixed', 'top' : '0px'});
          }
          if($(window).scrollTop() &lt;= 346){
              $('#rightShipping').css({'position' : '', 'top' : ''});
          }
          console.log($(window).scrollTop());
      });
  </code></pre>