facet
scroll
Everything that happens because a page is longer than a screen.
32 terms across 5 categories · all facets
component
layout
- Scroll container
The element that actually scrolls its overflowing content, distinct from the page, and the box the browser calls the scrollport.
- Scroll snap
Snap positions declared on a scroll container so scrolling settles on a chosen item edge instead of stopping wherever momentum runs out.
- Sticky footer
A footer held against the bottom of the viewport when the page is short, and pushed below the content when the page is long.
- Sticky header
A header that scrolls away with the page until it reaches the top edge, then stays fixed there while the rest keeps moving.
- Sticky sidebar
A side column that scrolls with the page and then holds in place once its top reaches the viewport edge, releasing at the end of its container.
- The fold
The bottom edge of the first screenful, above which content is seen without any scrolling and below which it must be earned.
pattern
- Back to top
A control that appears after the reader has scrolled some distance and returns them to the top of the page in one action.
- False bottom
A page that looks finished at a point where content actually continues, so the reader stops scrolling and never sees the rest.
- Infinite scroll
A list that appends the next page of results automatically as the reader approaches the bottom, so the content never ends and no page controls appear.
- Pull to refresh
Dragging a list downward past its top edge to trigger a reload, with an indicator that appears in the space the drag opens up.
- Quick return header
A header that slides out of the way while the reader scrolls down and returns immediately on the first upward scroll, without waiting for the top of the page.
- Reading progress
A bar tied to scroll position that shows how much of an article remains, usually pinned to the top edge and filling as the reader descends.
- Scroll edge fade
A gradient mask at the edge of a scroll container that fades clipped content out, hinting that more lies past the edge without drawing a control.
- Scroll hijacking
Overriding the browser's scrolling so a wheel turn advances a scripted sequence instead of moving the page by the distance the reader asked for.
- Scroll spy
Navigation that watches the scroll position and highlights the entry for the section currently in view.
- Scrollytelling
A narrative layout where a pinned graphic stays fixed while text scrolls past it, each step changing what the graphic shows.
interaction
- Drag autoscroll
Scrolling a container automatically when a drag is held near its edge, so an item can be moved somewhere currently off screen.
- Momentum scrolling
Content that keeps moving after the finger lifts, decelerating as though it had mass, so one flick can travel a long way.
- Overscroll
Scrolling input that continues after a scroller has reached its limit, which platforms answer with a bounce, a glow, or a handoff to the parent.
- Scroll anchoring
Keeping the reader's position fixed when content loads or resizes above it, by adjusting scroll offset so the visible text does not jump.
- Scroll chaining
When an inner scroller reaches its end and the gesture continues, the scroll passes to the page behind it unless that handoff is blocked.
- Scroll lock
Freezing the page behind an open overlay so a wheel or swipe moves the overlay's own content and never the document underneath.
motion
- Collapsing toolbar
A header that shrinks as the page scrolls, trading its large title and image for a compact bar that stays available.
- Parallax
Moving layers at different rates against the same input, so the slower layers read as farther away and the scene gains depth.
- Scroll pinning
Holding a section fixed in place while the page keeps scrolling, spending scroll distance on an animation instead of on movement.
- Scroll-linked animation
An animation whose progress is bound to scroll position rather than to time, so scrolling back rewinds it exactly.
- Scroll-triggered animation
An animation that scroll position only starts, after which it runs on its own clock and does not rewind when the reader scrolls back up.
- Smooth scrolling
Animating a programmatic jump so the page travels to its destination instead of cutting there, which keeps an anchor link or a back-to-top button from losing the reader's place.
- Stacking cards
A run of sections that each stick at the top of the viewport as the next one slides over it, so scrolling deals the page like a deck rather than passing it by.
- Velocity skew
Skewing or stretching content in proportion to how fast the page is scrolling and easing it back to square when the scroll stops, so speed shows up in the shape of the content.
- View progress timeline
A scroll timeline measured by one element's passage through the scrollport, with named ranges for entering, being contained, covering, and exiting.