javascript - CSS/JS 内容向上滚动而不是向下滚动

Question

我正在构建一个导航栏横跨整个网站的网站，并且它是固定的。 导航栏下方有一张图片，背景图片，设置为封面。图片下方是主要内容。

当您向下滚动时，导航栏从上到下覆盖图像，现在可以看到主要内容，有效地以向下的方式滚动。我想“扭转”它。所以导航仍然固定在它下面的封面图片，但这一次，当你向下滚动时，主要内容出现并从下到上覆盖图像。因此，当您向下滚动时，主要内容会向上滚动。

假设我的图片顶部有一个 1，底部有一个 2。因此，通常当您向下滚动导航栏从上到下覆盖图像时，1 将消失，而 2 将可见，直到它也被覆盖。我正在寻找的效果会使 2 消失，而 1 将保留在同一位置，直到它被主要内容覆盖。

我研究了视差，但我不确定这是否合适。而且我不知道如何实现这种效果。

希望您能理解我在这里尝试做的事情。如果您需要更多信息，请告诉我。

提前致谢。

编辑

效果可以在abduzeedo frontpage上看到

Answer 1

您需要将图像“附加”到背景吗？ 如果是这样，你不能把它固定到背景吗？

body {
    background-attachment:fixed;
}

来源:<罢工> http://www.w3schools.com/cssref/pr_background-attachment.asp https://developer.mozilla.org/en-US/docs/Web/CSS/background-attachment

注意:小心使用 W3School，它们的信息通常不正确，请参阅 here .