javascript - 滚动经过一个 div 后出现 div

Question

我知道有很多教程可以让 div 在向下滚动一定数量的像素后出现。

但我想要的是当用户滚动经过另一个 div 时让一个 div 出现。当他们向上滚动时，它必须再次消失。

为什么不经过一定数量的像素？我想在用户滚动横幅图像后将其用于我的菜单栏，以显示在页面顶部。但是当您缩小浏览器（手机、平板电脑、小屏幕......）时，横幅图像将缩小到！图像的高度将与以前不同。菜单栏会出现得更晚或更早；）这就是为什么我希望菜单栏出现在该图像（div）之后。

希望大家能帮忙！

Answer 1

既然我们在抽象地谈论，我将尽我所能解释。

你不能得到targetDiv的当前位置（div，之后向下滚动会显示菜单栏），然后使用相同的代码使menuDiv在向下滚动一定数量的像素后出现。

这个答案可能会帮助您获得 targetDiv 的当前位置。

Answer 2

所以，请执行以下步骤，让我知道它是如何进行的：

1) 获取jquery.appear

2）在您的选择器上应用消失事件：

$('someselector').on('disappear', function(event, $all_disappeared_elements) {
      // this element is now outside browser viewport
    });

3）在那个事件中，让另一个 div 消失。

$('theStuffToHide').toggle()

4) 最终结果

$('someselector').on('disappear', function(event, $all_disappeared_elements) {
    $('theStuffToHide').toggle()
});

这应该是您唯一需要的。

干杯，希望它有所帮助。

Answer 3

您可以检查 pageoffset 以跨越数量（目标的顶部偏移量 + 目标元素的高度）并显示 div。

当 pageoffset 小于计算量时，使 div 隐藏