Scrolling Metric Leaderboard

Overview

Scroll a column of rows into frame. Crossfade each row pale→focused. Land on the highlighted hero row.

Build

1. 01

   Title rises.

2. 02

   Column scrolls.

3. 03

   Pairwise opacity swaps focus row by row.

4. 04

   Hero row stays highlighted.

.col { animation: s4-scroll }
.row-n { animation: focus-n, pale-n }