title: Scroll div on pagescroll but stop after certain amount
body: <p>I have currently got an element to scroll on page scroll and I am looking to get it to stop after around 750px as it currently overlaps the footer on smaller monitors.</p>
  
  <p>I have found a couple of other examples which would require some restructuring of my code which I am trying to avoid, as the various other examples have to have certain divs relevant to eachother in order to stop the scrolling div at a certain point on the page.</p>
  
  <p>My current script is as below and wrks great, only I am unsure as to edit this to stop the div at a certain point:</p>
  
  <pre><code>&lt;script type="text/javascript"&gt;
  $(function(){
  var btn = $('.overview-wrap');
  var btnPosTop = btn.offset().top;
  var win = $(window);
  win.scroll(function(e){
      var scrollTop = win.scrollTop();
      if(scrollTop &gt;= btnPosTop){
          btn.css({position:'fixed',top:0,marginTop:0});
      }else if(btn.css('position') === 'fixed'){
          btn.css({position:'',top:'',marginTop:'20px'});
      }
  });
  });
  &lt;/script&gt;
  </code></pre>
  
  <p>Any pointers would be appreciated.</p>