Process · Sticky steps
A process section for Bricks Builder with numbered steps that stay in place while one photo per step slides up and lands on the one before, forming a stack as you scroll. The connecting line fills in and each number lights up as its photo arrives, with two buttons below.
In the annual plan, $99/year. See plans
Uses a small script. Turn on Code execution in Bricks › Settings › Custom code. How to turn on Code execution
Preview
Loading demo…
Template details
What’s inside
The components it’s built from. They come with the template when you paste it, and you edit them from the Bricks panel.
- FBK Button
A link styled as a button, with style, size and width.
- FBK Image
A photo with proportion, shape, decoration, border and an optional caption.
- FBK Intro
Eyebrow, title, lead and an actions slot for buttons.
- FBK Timeline
An ordered list of steps: vertical, alternate or horizontal.
- FBK Timeline step
One step of an FBK Timeline: marker, date, title and text.
Adjust it
Change these variables in Bricks to tune it; everything else follows your framework.
On the element Photos and steps, class fbk-sticky-steps
Distance from the top of the screen where the photos and the steps stay
- --fbk-t-sticky-top
- var(--space-xl)
How much lower each photo lands than the one before (0 = right on top)
- --fbk-t-stack-step
- 1em
Replaces
In Fancy Bricks 1.0 and 2.0 this was Sticky Timeline (2.0).
