Any idea or explanation how they did the backgrounds of this site? http://upcircuit.org/ Basically, a fixed background is the trick here. But there are multiple backgrounds and I am trying to solve the tricks of this site :)) I tried scanning the page source but I have no idea how they did this.
They have panels that are the size of the window. Then what they are doing is setting a background image for each panel and setting its background-attachment: fixed so that it stays positioned relative to the window, not the div it is in.
I set up the fundamentals for you here: 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;
}
Then you just need to specify a background-image for each individual panel.
Pretty sure this is what you are looking for.