title: jQuery Stop Fixed Sidebar When Reach Footer
body: <p>I have a sidebar widget on my website, when I scroll the page, sidebar will become position fixed. But this sidebar obstruct the footer. I want the sidebar stop fixed when touch the footer, something like this script <a href="http://jsfiddle.net/bryanjamesross/VtPcm/" rel="nofollow">http://jsfiddle.net/bryanjamesross/VtPcm/</a></p>
  
  <p>This is my website <a href="http://www.creativebrain.web.id/view/gadget/171/performa-buas-lg-g2-menantang-samsung-galaxy-s4" rel="nofollow">http://www.creativebrain.web.id/view/gadget/171/performa-buas-lg-g2-menantang-samsung-galaxy-s4</a></p>
  
  <p>Here is my code to fixed position the sidebar</p>
  
  <pre><code>    &lt;script type="text/javascript"&gt;
      $(function() {
          var nav = $('#gads300x600');
          var navHomeY = nav.offset().top;
          var isFixed = false;
          var $w = $(window);
          $w.scroll(function() {
              var scrollTop = $w.scrollTop();
              var shouldBeFixed = scrollTop &gt; navHomeY;
              if (shouldBeFixed &amp;&amp; !isFixed) {
                  nav.css({
                      position: 'fixed',
                      top: '90px',
                      left: nav.offset().left,
                      width: nav.width()
                  });
                  nav.css('z-index',999);
                  isFixed = true;
              }
              else if (!shouldBeFixed &amp;&amp; isFixed)
              {
                  nav.css({
                      position: 'static'
                  });
                  isFixed = false;
              }
          });
      });
      &lt;/script&gt;
  </code></pre>
  
  <p>I have modified that code like script in jsfiddle above, but I think something wrong in my code</p>
  
  <pre><code>    &lt;script type="text/javascript"&gt;
      $(function() {
          var nav = $('#gads300x600');
          var footer = $('#copyright');
          var navHomeY = nav.offset().top;
          var navFooterY = footer.offset().top;
          var isFixed = false;
          var $w = $(window);
          $w.scroll(function() {
              var scrollTop = $w.scrollTop();
              var shouldBeFixed = scrollTop &gt; navHomeY;
              var maxY = navFooterY - nav.outerHeight();
              if (shouldBeFixed &amp;&amp; !isFixed) {
                  if (scrollTop &lt; maxY) {
                      nav.css({
                          position: 'absolute',
                          top: '0px',
                          left: nav.offset().left,
                          width: nav.width()
                      });
                      nav.css('z-index',1000);
                  }
                  else{
                      nav.css({
                          position: 'fixed',
                          top: '90px',
                          left: nav.offset().left,
                          width: nav.width()
                      });
                      nav.css('z-index',1000);
                  }
                  isFixed = true;
              }
              else if (!shouldBeFixed &amp;&amp; isFixed)
              {
                  nav.css({
                      position: 'static'
                  });
                  isFixed = false;
              }
          });
      });
      &lt;/script&gt;
  </code></pre>