Fixed background slider with scroll effect

Hi guys and gals! I’m trying to achieve the same scrolling effect like this https://melliandshayne.com/

But am failing in 2 things:

  1. can’t make the header go above the slider. its either above or below masthead?
  2. don’t know how to achieve the scrolling effect. “Parallax” toggled on in Slider Rev but doesn’t seem to give any effect.

My website is https://www.youngandwild.se/ .

Help is muuuuch appreciated! :slight_smile:

Hey @anhanhoi,

Since you’re using Pro. That is possible. Here are the steps to replicate that.

1. Use our theme’s Page Background Image feature. If you use 2 or more images, this becomes a slider background. The effect is similar to your sample site where an image fades to another image.

2. Use a Blank No Container | Header Footer Page template. For more details about Page templates, please see https://theme.co/apex/forum/t/meta-options-pages/144

3. Create a Pro custom header for your page. The header should have 2 bars. The top bar’s height should be 80vh and the bottom one that will contain the menu should be 20vh. I believe you get that the height of both bars combined is 100vh and that is the full height of the screen.

Below is a video demonstrating the steps. You can lower the play speed and pause and play the video to follow along.

Hope that helps.

Thanks @christian_y!!! :slight_smile:

On behalf of my colleague, you’re welcome :slight_smile:.

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