3

我有兴趣模仿这里看到的背景效果:(Link)。基本上它是一个在顶部滚动内容的静态背景,但是页面上的每个“窗口”部分都有不同的背景。见下文:

在此处输入图像描述

进一步向下滚动:

在此处输入图像描述

我最初的想法是只有一个巨大的静态背景,每个“窗口图像”垂直堆叠在一起,然后在顶部有透明背景的 div,但这似乎是错误的。

我怎样才能重现这种效果?

4

3 回答 3

4

一般来说:

  1. 对顶栏使用fixedCSS 定位(如上所述)
  2. 给你的前台容器一个大于z-index你的后台容器
  3. 通过将某些部分的背景设置opacity0

您将需要试验背景图像和前景容器的宽度以使事情正确。祝你好运!

于 2013-05-10T01:59:20.717 回答
1

您如何在您尝试复制的主题森林中购买优质产品。网络上有许多视差滚动教程将引导您完成此操作。

于 2013-05-10T04:01:57.367 回答
0

可以使用fixedcss定位来获得顶栏的效果。然后对于页面的其余部分,我将使用某种封装,该封装使用css 定位div向下移动顶部栏的高度。relative然后,对于您的不同页面部分,只有 div 一个接一个地堆叠,并且具有不同的背景。

css定位相关的链接

于 2013-05-10T01:53:54.307 回答