0

我有一个顶部导航栏位置：“静态”，但是当用户滚动超过导航栏的高度时，位置更改为“固定”，以便导航栏附加到窗口的顶部。当滚动回页面顶部时，它也会切换回“静态”。

导航栏有一个静态横幅 div，它保留在页面顶部。当窗口顶部滚动到导航栏下方时，它会变为位置：“固定”。

当页面刚刚长到需要滚动时，我一直在经历一些抖动，但不足以保持滚动高度和导航栏为“固定”，所以当滚动到页面底部时，导航栏在“静态”和“固定”。

我已经发布了关于我如何设置它的 jsfiddle，但由于我遇到的问题，我不太能够复制这个问题：http: //jsfiddle.net/bB7Bf/

HTML：

<div id="topMaterial">Static Top doesn't move</div>
<div id="ktNavbar">topbar that sticks to top of window after scrolls below static height</div>​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​

JS：

$(function() {
var navScroll = $(window).scroll(function() {

    var scrollPosition = $(this).scrollTop();

    if (scrollPosition > 120) $("#ktNavbar").css({
        "position": "fixed",
        "top": 0,
        "left": 0,
        "right": 0
    });

    else $("#ktNavbar").css("position", "static");
    });
});​

是否有解决方法来防止“静态”和“固定”之间的这种滚动条件抖动？

4

1 回答 1

1

为什么不让它一直保持固定并在下面的任何内容上添加上边距？不需要js。

于 2012-10-30T20:30:52.993 回答