Skip to content

Overscroll areas via command=toggle-overscroll #12273

@vmpstr

Description

@vmpstr

What problem are you trying to solve?

Common UI patterns like side-menus (swiping past the edge to reveal a menu) or swipe-to-action (swiping a list item to reveal delete buttons) currently rely on complex nested scrollers or JavaScript gesture polyfills. These workarounds are difficult to implement, computationally expensive, and often fail to provide accessible alternatives for non-touch users. This proposal aims to address common cases with a declarative minimal-script solution

What solutions exist today?

Currently effects like this are implemented in script with controlling positioning of the panels in response to mouse/touch moves. It is possible to construct nested scroller solutions or use scroll driven animations for similar effects, but it is typically hard to achieve the right behavior.

How would you solve it?

We propose a set of HTML attributes that declaratively bind an element (the “overscroll content”) to the scroll boundary of a container.

Crucially, this binding is defined on an activatable element (like a ). This ensures that every gesture-based action has a guaranteed, accessible fallback interaction (click/Enter) without extra developer effort.

Anything else?

This is currently being incubated at OpenUI.
Explainer (from which some of the content of this issue was sourced): https://open-ui.org/components/overscroll-actions.explainer/

/cc @mfreed7 @flackr

Metadata

Metadata

Assignees

No one assigned

    Labels

    addition/proposalNew features or enhancementsneeds implementer interestMoving the issue forward requires implementers to express interest

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions