Pro header / sticky header


i can’t figure out how to set a trigger for a sticky header.

2 questions:

  1. The text of the header should be white on the rev-sliver and after the slider switch to black
  2. sticky header should show after the hero section (rev-slider)

are there any tutorials for pro user?


Howdy, @BecauseMountains!

Thanks for writing in!

  1. Pro does not provide any sort of color alterations for bars when static vs. sticky. Bars and their constituent Elements have all of their base colors in the builders, but we do not provide an “alternate” state like this because it would add a tremendous amount of controls for a variable state that not everyone wishes to use and could easily overwhelm users with the choices needed (you’d have to adjust the color of the bar, all text, background colors, borders, shadows, et cetera…it would be way too extensive to be useful in the tool). If you want to style your bar differently as it “sticks” to the top of the page, you can style off of the variable .x-bar-fixed class that is added and removed to create the sticky state.
  2. If you download the Starter Pack in Pro v2.0.0’s Template Manager, you’ll see that we have a header called “Sticky Bars” that shows off some of these techniques, specifically placing a bar after a large section up top.

As for tutorials, everything is located within our Knowledge Base:

I would strongly recommend going through everything in the Element Resources section of that page as it gives an incredibly detailed overview of how to use all of our Elements in the builder and achieve certain layouts and looks.

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