Setting Two "background-attachment: fixed" CSS Settings Doesn't Work

[tomr96]

Hi there,

I am trying to setup my a BG on a Section to stay attached and not move with the scroll paralax - using this code from the Forum I am able to make it work… but only for one section - add it to two sections or more on a page and only the first will work.

I have tested this on several sites of mine - including one with the new Pro 4 Beta 8 and the issue is still there in this Beta 8 version.

Would someone be able to take a look at this.

The website I am using the below code on live is Pro 3.2.3.

NOTE: all works fine in the editor - not on the live site though.

Clearing all Cache’s doesn’t have any impact.

Code:

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

Thanks, Tom.

[marc_a]

Hi Tom,

Thanks for reaching out.

Please double-check the credentials you provided because it is not working.

Hope that helps.

Thank you.

[tomr96]

Apologies - amended the secure note now.

Thanks, Tom.

[nabeel]

Hey Tom,

Thank you for updating the credentials. I checked your setup and the code wasn’t working because it was missing the closing curly bracket.

I went ahead and closed the bracket in all sections where you’ve used the code on this page. Now everything seems to be working fine.

Cheers!

[tomr96]

Thanks for this, it’s working great.

With one slight issue, on some devices (Safari mostly it seems) the background images are not respecting the size variable under the background lower layer setting on each section.

They are respecting this setting if I turn off the global fixed backgrounds.

Bit odd, not sure if this is a glitch?

Thanks, Tom.

[ruenel]

Hello Tom,

I have compared your site in Safari and Chrome. The image sizes are now the same. The only thing I noticed is that on Safari, there is a sudden jerk movement of the background image as you scroll the page up or down. It is as if the background image moves up and down for a second then stopped as a fixed background. This could be coming from the Safari browser and how it renders the background as a fixed attachment.

Best Regards.