滑动到固定位置标题的内容

时间:2011-11-27 15:52:06

标签: javascript jquery css css-position

我有一个页面,当你滚动并将div'固定'置于顶部时:0它变为position:fixed,以便它下面的内容滚动。

现在,在该标题上有一些按钮可以使用滑动效果将您带到每个div部分。

当位置固定后,内容会大约上调100px。

示例:http://www.screenr.com/Rbts

这是真实的例子:http://jsfiddle.net/Kat9s/

我怎么能阻止它?

1 个答案:

答案 0 :(得分:1)

我添加了填充类。当您的固定元素被修复时,此类将应用于您的#content。它的逻辑很简单,它在需要时填补空间。

.filler{margin-bottom:140px}

$(window).scroll(function(){
    if( $(window).scrollTop() > stickyHeaderTop ) {
        $('#fixed').addClass("sticky");
        $('#first').removeClass("fixed");
        $('#content').addClass('filler');
    } else {
        $('#fixed').removeClass("sticky");
        $('#content').removeClass('filler');
    }
});

http://jsfiddle.net/Kat9s/1/