[Support request] Functions code to make the sections parallax start before reaching top of page?

[John]

Is there some functions.php code I can drop in to make the sections parallax start scrolling before the background image reaches the top of the page?

I saw this post: https://generatepress.com/forums/search/parallax+sections+top/ but it’s not helping. The code provided there just kills the site. (White screen, nothing loads until you take it back out)

The goal is to make parallax start scrolling immediately even when the 300px tall background section is at the bottom of the page, a parallaxing background image at each and every part of it being shown on the page while scrolling.

The section I’ve set is the stacked logs down the page some if you want to take a look at it.
https://modernwebsites.net/apts (this will be a temp site, so if anyone reads this in the future, it probably won’t work for you. Sorry)

Thanks and as always, you guys rock!

GP Version 2.2.1
GP Premium Version 1.7.5
WP 5.0.2
PHP 7.0.1

[David]

HI there,

you may be better off just fixing the background image for that section with this CSS:

#generate-section-5.generate-sections-container {
    background-attachment: fixed;
}

Note that this won’t apply on Mobile devices.

If you wanted to do this for other sections the give the section a class e.g fixed-background and instead of this selector #generate-section-5.generate-sections-container use .fixed-background.generate-sections-container

[John]

Yeah, I’ve done that but really trying to get Parallax to work like it does on a lot of other sites using it (non GP sites I mean).

[David]

The Script used in sections was specifically built for the effect to kick in when the image hits the top of the viewport. You would need to implement a different JS solution to achieve that. Something like this for example:

https://jaicab.com/Paraxify.js/

[Author]

Posts