Make a sliding div stop when reaches end of post div
<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>
