Parallax scrolling effect

[TomasJarvling]

Hi
I wonder if it is possible to create a scrolling parallax effect like the one attached.

Tomas

[prakash_s]

Hello Tomas,

Thanks for writing to us.

You can set the parallax on the background images I would suggest you go to the section —>set background image —>enable the parallax.

Hope it helps
Thanks

[TomasJarvling]

Hi.
Yes - i am familiar with the parallax settings. But what I would like to create is an effect where the background, such as in my example, is still and the content of the website moves above it. There is kind of an “opening” in the content showing the background picture while scrolling and background picture is still. Does it make sense?

[ruenel]

Hey @TomasJarvling,

Perhaps these old threads may help you:

• Can I create a parallax effect like this with photos in X? - Support - Themeco Forum
• Help with CPT relationships - Support - Themeco Forum

Best Regards.

[TomasJarvling]

Thanks. It worked on my Mac but not on my iPad or my phone. Do I need to do something else?

[ruenel]

Hey @TomasJarvling,

Have you cleared the browser cache on your phone? You can use private browsing mode before testing your site again.

Kindly let us know how it goes.

[TomasJarvling]

Hi. Thanks for the reply.
I have cleared the cache and can see the effect on my Mac on this page at the bottom: https://www.nykopingpickleball.se/
But on my ipad and my iphone the effect does not seem to work.

[ruenel]

Hello @TomasJarvling,

Are you referring to the parallax effect of the last Section element on the page? It is working on my Android phone. Please make sure that you are in private browsing mode on your iPad or iPhone and test the site again.

Thanks.

[TomasJarvling]

Hi
Yes - the last section element on the page. I opened a private browsing page on my iphone and it looks like the attached file.

[ruenel]

Hi There,

Are you referring to the white line? It could be coming from an empty row or a margin from a section. Please provide access to your site so we can check your custom page element layout. You can create a secure note in your next reply with the following info:
– Link to your site
– WP login URL
– WP username
– WP password
– WP Administrator Role
– Confirmation that we can access and make changes to your site

To know how to create a secure note, please check this out: How The Forum Works

Best Regards.

[TomasJarvling]

And the wp login url is: www.nykopingpickleball.se/wp-admin

[ruenel]

Hey @TomasJarvling,

The Parallax option in the Section element advanced background option must be turned OFF and then add the code given in the old thread:

• Can I create a parallax effect like this with photos in X? - Support - Themeco Forum

Check your page now as I created a demo.

Thanks.

[TomasJarvling]

Hi. Thanks.
Where did you create the demo?
Section 5 on my page contains the “normal” parallax option. Section 6 contains the new css code with the parallax effect turned off. Section 6 looks strange on my ipad and my phone

[ruenel]

Hey @TomasJarvling,

The CSS code takes effect in the Section 6 element while the parallax effect option is turned OFF. If you turn it ON, the CSS code will no longer work. If we go back to the original example, it seems that it is using a Fixed DIV element with some more custom CSS coding. Be advised that custom coding is beyond the scope of our support under our Support Policy. If you are unfamiliar with code and resolving potential conflicts, you may select our One service for further assistance.

Thank you for your understanding.