title: Make a sliding div stop when reaches end of post div
body: <p>i have a floating box on the side of my post. This is the code of the post div</p>
  
  <pre><code> &lt;div class="post-entry&gt;
      &lt;div class="float-div"&gt;
         data 
      &lt;/div&gt;
    divs and text
   &lt;/div&gt;
  </code></pre>
  
  <p>And this is the javascript code that make it to move with a nice effect</p>
  
  <pre><code>&lt;script type="text/javascript"&gt;     
  $(function() {
   var offset = $(".float-div").offset();
   var topPadding = 100;
   $(window).scroll(function() {
       if ($(window).scrollTop() &gt; offset.top) {
           $(".float-div").stop().animate({
               marginTop: $(window).scrollTop() - offset.top + topPadding
           });
       } else {
           $(".float-div").stop().animate({
               marginTop: 7
           });
         };
      });
    });
   &lt;/script&gt;
  </code></pre>
  
  <p>The problem is that it moves thorough the whole page all the way until the footer. But it needs to stop at the end of the div "post-entry". Any ideas on how to make it stop?</p>