固定的左导航后，粘滞标题的某个点

Question

我想用具有“固定”左导航的粘滞标题的页面原型。

http://jsfiddle.net/rkr2/R7BH7/1/

HTML：

<div class="nav-container"> 
    <div class="nav"> 
     <div id="bad"> </div> 
    </div> 
</div> 

<div id = "container"> 
    <div id = "left"> </div> 
    <div id = "right"> </div> 
</div> 

JS的粘头：

var nav = $('.nav-container'); 
$(window).scroll(function() { 
    if ($(this).scrollTop() > 200) { 
     if (!nav.hasClass('f-nav')) { 
      nav.addClass("f-nav"); 
      nav.hide(); 
      nav.slideDown("slow"); 
      $('#bad').css('background-color', 'red'); 
     } 
    } else { 
     nav.removeClass("f-nav"); 
     // nav.slideUp("slow"); 
     $('#bad').css('background-color', 'yellow'); 
    } 
}); 

现在，我想 “左” 格留权的粘头下方后滚动（并保持在那里）。我怎样才能做到这一点？

Answer 1

使用stickyfloat插件。

http://dropthebit.com/demos/stickyfloat/stickyfloat.html

只需设置OFFSETY设置，但是高大的topnav是，它会留在它下面。