jQuery：スクロール時にウィンドウの下端でdivを修正しますか？

Question

ウェブサイトにサイドバーがあり、高さに達するとブラウザウィンドウの一番下に固執する必要があります。この音は複雑ですが、おそらくそうではありません。だから、再びhttp://jsfiddle.net/dJXS2/1/

$(window).scroll(function() { 

    var bh = $(window).height(); 
    var st = $(window).scrollTop(); 
    var eh = $('#element').height(); 
    var eo = $('#element').offset(); 

    if (st >= (eo.top + eh) - bh) { 
     //$('#element').css('position', 'fixed'); 
    } 


}); 
​ 

- 私が欲しいもの：

私はjsfiddleにほとんどのデモをした あなただけのテストの目的のために体が長くなりDIV page-heightを参照してください。緑色のサイドバーはページの高さよりも短くなっています。ユーザーが緑色のバーの下をスクロールすると、緑色のバーを現在の位置に固定します。だから私は、ユーザーが緑色のバーの下の空白を見ることを望んでいない。もう一度スクロールすると、通常のスクロール動作を元に戻し、緑色のバーをもう修正しないでください。

これに関するアイデアはありますか？

Answer 1

あなたは、位置使用することができます固定

http://jsfiddle.net/dJXS2/5/

$(window).scroll(function() { 

    var bh = $(window).height(); 
    var st = $(window).scrollTop(); 
    var el = $('#element'); 
    var eh = el.height(); 
    if (st >= (100 + eh) - bh) { 
     //fix the positon and leave the green bar in the viewport 
     el.css({ 
      position: 'fixed', 
      left: el.offset().left, 
      bottom: 0 
     }); 
    } 
    else { 
     // return element to normal flow 
     el.removeAttr("style"); 
    } 

});