有什么想法或解释他们是如何制作这个网站的背景的吗? http://upcircuit.org/ 基本上,固定背景是这里的诀窍。 但是有多个背景,我正在尝试解决这个网站的技巧:)) 我尝试扫描页面源代码,但我不知道他们是怎么做到的。
最佳答案
它们的面板大小与 window 一样大。然后他们正在做的是为每个面板设置背景图像并设置其 background-attachment: fixed
以便它保持相对于窗口的定位,而不是它所在的 div。
我在这里为您设置了基础:http://jsfiddle.net/Zc822/
body, html {
width: 100%; // Sets the html and body width and height
height: 100%; // to the width and height of the window.
margin: 0;
}
.panel{
width: 100%; // Sets each panel to the width and height
height: 100%; // of the body (which is set to the window)
background-repeat: no-repeat;
background-attachment: fixed; //Sets background fixed in window
background-size: cover;
}
然后你只需要指定一个background-image
对于每个单独的面板。
很确定这就是您要找的。p>
关于HTML/CSS - 滚动时固定背景,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/23173861/