Question

我创建了一个粘性导航，当用户滚动时，它会固定在页面顶部。如果用户向上滚动，它应该返回到正常位置。我在本地主机上完美地工作，但是当我在线上传时，只要你滚动页面的一点点，粘性导航就会一直跳到顶部，它永远不会返回正常位置。

关注的jQuery是：

var yOffset = $("#local-nav-wrapper").offset().top;
$(window).scroll(function() {
    if ($(window).scrollTop() > yOffset) {
        $("#local-nav-wrapper").css({
            'top': 0,
            'bottom': 'auto',
            'position': 'fixed'
        });
    } else {
        $("#local-nav-wrapper").css({
            'top': 'auto',
            'bottom': 0,
            'position': 'absolute'
        });
    }
});

有关的CSS是：

#local-nav-wrapper {
    position: absolute;
    bottom: 0;
    width: 100%;
    background: rgba(0, 0, 0, 0.8);
    padding: 10px 0;
    z-index: 6000;
}

Answer 1

如果您在IE中工作，请尝试将$(window).scrollTop()替换为document.documentElement.scrollTop或window.scroll(0,0)。也许有帮助。

Answer 2

我正在解决同样的问题。我发现this thread on css tricks表明：

当它在localhost中加载时，它真的很快并且它获得了正确的值，但是在服务器上它在元素设置之前获取值。

在本地主机上工作的粘性导航但在我上传时（在webkit浏览器中）不能

2 个答案: