滚动经过一定数量的像素时位置固定

我正在寻找一种方法，仅在向下滚动大约 170 像素后将页面的 #header 元素定位为“固定”。

标题上方是一个横幅，因此当人们向下滚动时，我希望横幅滚动走，标题在到达窗口顶部时保持固定，页面内容在标题下方滚动。

http://jsfiddle.net/tdskate/zEDMv/ http://jsfiddle.net/tdskate/zEDMv/

This http://jsfiddle.net/zEDMv/13/这是总体思路，尽管您可能想稍微修改一下 css。

var header = $("#header");
$(document).scroll(function(e) {
    if($(this).scrollTop() > $("#banner").height()) {
        header.css({"position" : "fixed", "top" : "0"});
    } else {
        header.css("position", "relative");
    }
});