Fixed background not working

[promofuse]

I dug through the forums and your answer seemed to be the same for all, with this post being the most recent one I found:
https://theme.co/apex/forum/t/fixed-background-image-css-affects-whole-site/47589
I realized my pages were doing the exact same thing as indicated in that person’s post, where ALL of my background images on that page were becoming fixed. Your solutions in that post didn’t work for me. All my background images on that page are still fixed. I really don’t understand why making a fixed background is such a chore in Cornerstone. I’ve spent at least over an hour on this to no avail, whereas in some other page builders I’ve used, it literally takes me two seconds to check on an option for a fixed background. For how robust X and Cornerstone are, it seems like I have to get my hands dirty in code on nearly every page I build, which seems silly. You guys HAVE to get these basic features in there. Parallax background images aren’t quite as popular now and we need to be able to easily make a background image fixed. In the meantime, is there a way I can fix this?

[friech]

Hi @promofuse,

Thank you for writing in, we’ve added this as a feature request so it can be taken into consideration for future development.

For now, you can add these custom CSS on the Section’s Element CSS area.

For lower layer background-image

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

For upper layer background-image

$el .x-bg-layer-upper-image {
	background-attachment: fixed;
}

Hope it helps,
Cheers!

[promofuse]

That code still did the same thing. The image backgrounds in the columns within that section are still changing to a fixed background. I want JUST the background on the section to become fixed.

[friech]

Hi @promofuse,

Thank you for the clarification, please update the given CSS code to this:

$el.x-section > .x-bg .x-bg-layer-lower-image {
 background-attachment: fixed;
}

$el.x-section > .x-bg .x-bg-layer-upper-image {
 background-attachment: fixed;
}

If that did not work still, please provide us the page URL so we can take a closer look.

Thanks,

[promofuse]

That worked. Thank you. However, I did notice my Pro header is doing the same thing. Do I use that same code you just gave me, but sub in “.x-bar” or something like that for “.x-section”?

[Prasant]

Hello @promofuse,

Thanks for updating the thread.

Can you please share the website URL? I tried looking at your licence manager and there are bunch of Pro Theme licences. I tried looking at them not I am not able to zero on the website that’s having the issue.

Thanks.

[ruenel]

Hello @promofuse,

To resolve this issue, please add the following CSS code in the X > Theme Options > Global CSS (http://prntscr.com/evui3r) instead so that it will be applied globally:

#fixed-bg .x-section.bg-image, .x-bg .x-bg-layer-lower-image, .x-bg .x-bg-layer-upper-image {
    background-attachment: fixed;
}

We would loved to know if this has work for you. Thank you.