Design Idea Question

@craigsteveid
I was looking through the examples on the Evolve Hub and came across the Gale Force lesson you made. I love how your opening view is an image and as you scroll down the image scrolls and at the same time the next section doesn’t just scroll up with it but also covers it at the same time. I was wondering how you did that? I tried to play around and figure it out but haven’t had any success. Any help would be greatly appreciated!

https://craigstevensonid.s3.ap-southeast-1.amazonaws.com/Gale+Force+S+Series+Product+Knowledge/index.html#/page/638583e515cd0f09a04a247d

Thank you!
J

Hey @JanielleZ!

I had to jump in :slight_smile: It’s such a great looking course isn’t it!

Here’s how you do it. The image at the top is a HERO IMAGE on the page.

Then, in your Theme, go to Hero image settings > Animations and turn on the Parallax Effect on Pages.

Enjoy!

Thank you SO much @hbailey !!

1 Like

Hey Janielle,

Thanks for getting in touch. Glad you liked the course!

It’s a page hero image, but you need to set the ‘Enable Parallax Effect on Pages’ button to on (see below)

You can find this setting in ‘Theme - Hero Image - Animations’

Hope that helps! Let me know if you have any other questions.

All the best
Craig