当窗口等于 div 时显示 div 但当窗口超过 div 时隐藏

【问题标题】：Show div when window equals div but hide when the window has passed the div当窗口等于 div 时显示 div 但当窗口超过 div 时隐藏
【发布时间】：2016-12-02 17:34:03
【问题描述】：

我希望在滚动特定 div 时显示 div，但希望在滚动经过该 div 时隐藏它。

我能够做到，当窗口到达 div 的顶部以显示我的按钮时：Example Fiddle.

我看到了这个高度范围的解决方案，但无法复制它来解决这个问题：Only show div when in the middle of the page

当您滚动过去红色 div 时，如何隐藏 div？

【问题讨论】：

标签： javascript jquery html css

【解决方案1】：

在 if 语句中添加一个检查，检查按钮是否小于您希望它消失的 div 的顶部位置。

$(window).scroll(function() {
    if($(this).scrollTop() >= $('.separator').offset().top && $(this).scrollTop() <= $('#header').offset().top) {
        $('#button').show();            // Show the arrow
    } else {
        $('#button').hide();            // Hide the arrow
    }   
});

https://jsfiddle.net/vo7Ley5e/2/

【讨论】：

完美运行。当我尝试复制时，我对两个部分都使用了相同的元素 #header。使用 .separator 有效！