如何使用jQuery在不同的Div ID之后和之后显示某个Div ID

Question

我正在尝试创建一个jQuery代码，以便我的菜单将隐藏在页面的顶部，并在其处于或超过某个div ID时显示。我已经写了我能做到的最好的事情，但是没有用。任何人都可以帮我配置正确吗？谢谢。

jQuery (function($){
var topHeader = $('#top-header');
var mainSlider = $('#pbf-main-slider');
    if (topHeader >= mainSlider) {
        topHeader.show();
    } else {
        topHeader.hide();
    }

});

菜单隐藏区域

菜单显示区域

最终结果（我添加了需要此功能的菜单的另一部分）

    jQuery (function($){
var topHeader = $('#top-header');
var mainHeader = $('#main-header');
var mainSlider = $('#pbf-main-slider');
var mainSliderHeight = mainSlider.outerHeight(true);
$(window).scroll(function () {
    var scrollTop = $(this).scrollTop(); //get the scroll position
    if (scrollTop >= mainSliderHeight) {
        topHeader.slideDown(1000);
        mainHeader .slideDown(1000);
    }
    else {
        topHeader.hide(500);
        mainHeader .hide(500);
    }
})
});

Answer 1

你应该得到主滑块的高度，如下所示：

var mainSlider = $('#pbf-main-slider');
var mainSliderHeight = mainSlider.outerHeight(true);

然后如果滚动超过mainSlider的高度，则显示顶部栏，如下所示：

$(window).scroll(function () {
    var scrollTop = $(this).scrollTop(); //get the scroll position
    if (scrollTop >= mainSliderHeight) {
        topHeader.show();
    }
    else {
        topHeader.hide();
    }
}