フッターを叩いたときのサイドバーの停止

Question

私はここで多くの提案を試みましたが、うまくいかないようです。
私は小さな画面上でフッターの上に行くから「固定左「のdivクラス=」固定-COL-左サイドバーを停止しようとしている。

<section class="contain-main"> 
<div class="center-div inner-col-2"> 
<div class="fixed-col-main"> 
<div class="fixed-col-left fixed-left"></div> 
<div class="fixed-col-right"></div> 
</div> 
</div> 
</section> 
<footer class="footer-main"></footer> 

これまでのところ、私はこれに来ているが、結果をJSまだ動作していないよう

<script type="text/javascript"> 
    $(function() { 
     $.fn.scrollBottom = function() { 
      return $(document).height() - this.scrollTop() - this.height(); 
     }; 

     var $el = $('#fixed-col-left>div'); 
     var $window = $(window); 

     $window.bind("scroll resize", function() { 
      var gap = $window.height() - $el.height() - 10; 
      var visibleFoot = 400 - $window.scrollBottom(); 
      var scrollTop = $window.scrollTop() 

      if(scrollTop < 400 + 10){ 
       $el.css({ 
        top: (400 - scrollTop) + "px", 
        bottom: "auto" 
       }); 
      }else if (visibleFoot > gap) { 
       $el.css({ 
        top: "auto", 
        bottom: visibleFoot + "px" 
       }); 
      } else { 
       $el.css({ 
        top: 0, 
        bottom: "auto" 
       }); 
      } 
     }); 
    }); 
    </script> 

ビデオのデモは何が起こっているかを示す http://sendvid.com/vfbv7pvd

Answer 1

を問題が言うCSSの定義である：。。

.fixed-col-left.fixed-left { 
    position: fixed; 
    top: 113px; 
    } 

position: fixedは、それが重なるように引き起こしている、とあなたのスクリプトでabsoluteにposition属性を設定すると、重複が起こって停止します。