← All effectsScroll-drawn steps

WBL effects library

Scroll-drawn steps

"How it works" steps light up as a line draws down them.

Use it for: CALL and BOOK businesses with a real sequence: call → quote → fix; book → consult → treatment.
How: <ol data-fx="steps-draw"><li>…. Numbers come from a CSS counter. Only for real sequences (anti-slop rule).
Weight: 1.8 KB gzipped (CSS + JS), no dependencies
Scroll ↓

How it works

Three steps, no surprises

  1. Call or text

    A real person answers, day or night, and asks what's going on.

  2. Upfront price

    We look, explain the fix and give the price before any work starts.

  3. Fixed and cleaned up

    Shoe covers on, mess gone, and a photo of the finished job.

  4. Follow-up

    We text the next day to make sure everything is still dry.

← All effects