Best practice for static background

[vdongen]

How to get a static background with the instruments in the section. I use one (lower) background layer. I am struggling with the parallax background -> lower layer size.

[christopher]

Hi there,

If by static background you mean the fixed attachment of the background image you can achieve the effect following the steps below:

1. Go to Cornerstone and add a section
2. Add a background image to that section:
   
3. Click on the Customize tab in the Section Options
4. Add the fixed-bg class to the class input:
   
5. Go to X > Launch > Options > CSS and add teh code below:

.fixed-bg .x-bg-layer-lower-image {
    background-attachment: fixed;
}

Thank you.

[vdongen]

I may not be so clear, what I mean is that while scrolling the background remains in the same position. It still slowly moves up or down while scrolling and I am looking for a solution to have it not moving during scrolling.

[ruenel]

Hello There,

Thank you for the clarifications. Regretfully there are only two ways to have in the parallax effects. It is either the background image is fixed and in the same position or it slowly moves up or down while scrolling.

The code should have work. The problem is that when you copied it, you added extra characters. Please check your code because right now you added this which is invalid.

/* Static Background */
*.fixed-bg .x-bg-layer-lower-image {
    background-attachment: fixed;
}

And by the way, I noticed that you have commented the css lines incorrectly.

If you want to use comments in css you use this;

/* your comment here */
/* color: black; */

Hope this helps.

[vdongen]

Thanks. I thought * means comment off, I did replace it with // (possible?).
On some sites the background does not move while scrolling. The code you gave me works, it does the same as switching off parallax.

[ruenel]

Hey There,

You’re welcome!
We’re glad we were able to help you out.

Cheers.