Question

我对此工作没有任何问题，整个网站的构建。然后，在我应该启动的那天，粘性菜单停止正常工作。菜单应该从底部开始，滚动到顶部，然后粘贴（位置：固定）。

现在，它滚动大约10px，然后跳到顶部。为什么scrollTop距离计算不正确？

的实时网站

这是粘性菜单的代码。我也使用JS将div的最小高度设置为窗口高度，但这里还没有包含该代码。

$(function(){
    var stickyRibbonTop = $('#wrapper-wcf53badf7ebadf7').offset().top;

    $(window).scroll(function(){
            if( $(window).scrollTop() > stickyRibbonTop ) {
                    $('#wrapper-wcf53badf7ebadf7').css({position: 'fixed', top: '0px', 'background-image':'url(http://amarshall.360zen.com/wp-content/uploads/2014/07/menu-fade-background2.png)'});
                    $('#block-bcf53bf14093931c').css({display: 'block'});
            } else {
                    $('#wrapper-wcf53badf7ebadf7').css({position: 'static', top: '0px','background-image':'none'});
                    $('#block-bcf53bf14093931c').css({display: 'none'});
            }
    });
});

提前感谢您的帮助！我还不是JS或jQuery专家，所以任何有关清理工作的建议都会受到赞赏。

注意：该站点是在WordPress上构建的，因此无冲突模式有效。

Answer 1

我认为在设置$('big-div')的最小高度之前，您正在初始化粘性菜单功能。

在页面加载时，菜单从顶部开始54px，因此当您将offset().top值存储为stickyRibbonTop时，它将以54px的速度存储。然后在您的滚动事件中，您将与此进行比较。

尝试在代码中首先设置div的min-height，然后再运行相同的脚本。 stickyRibbonTop的值应该是正确的。

请记住，每次更新stickyRibbonTop时都需要重置window.height()，因此您应该将此粘性菜单功能设置为命名函数，并在{{{}结束时调用它。 1}}功能。像这样的东西：

wrapper_height

scrollTop突然无法用于粘性菜单

1 个答案: