Parallax Scrolling Backwards on Chrome

Hey all, I have several parallax sections on my site, that work fine on Firefox and Safari, but on Chrome they’re not only scrolling backwards, but leaving blank space above the image as it scrolls.

Can’t seem to figure this one out.

www.theseforeignroads.com

Hi @kerridawn,

Under Background Parallax, please set Lower Layer Size to 100% only.

Try again after that.

That stops the parallax effect altogether, in all browsers…

Hello @kerridawn,

I have checked your site and the parallax is working on my browser.

And also I found out that you are using CloudFlare. Right after your updates, please log in to your CloudFlare account and purge your site cache. You also need to regenerate the minified CSS and JS files in CloudFlare.

Kindly let us know how it goes.

Hey, I cleared CloudFlare and it hasn’t changed anything.

The top image had background:fixed, which is why it had that effect. However, if you notice the other three image background sections, when you scroll through the page, the backgrounds are scrolling in the opposite direction. This isn’t what I’m looking to achieve. And it only happens in Chrome.

When I use Firefox or Safari, the background image scrolls (though slower due to the parallax) in the same direction as the page.

Hello @kerridawn,

To better assist you with your issue, kindly provide us access to your site so that we can check your settings. Please create a secure note with the following info:
– Link to your site
– WordPress Admin username / password

To know how to create a secure note, please check this out: https://theme.co/apex/forum/t/how-to-get-support/288

Cheers.

1 Like

Hello @kerridawn,

Please enable the “Reverse” option and position the image to the top of the section.

Hope this helps.

Yes! That did the trick, thank you so much!

You’re most welcome!

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.