How can we improve the Microsoft Edge developer experience?

Implement CSS 'overscroll-behavior'

Consider implementing the new CSS overscroll-behavior property.

## Specification
This feature specification is being incubated in WICG:
https://wicg.github.io/overscroll-behavior/

Additional background on this feature may be found here:
https://github.com/w3c/csswg-drafts/issues/769

## Summary
CSS overscroll-behavior standardizes a supercharged version of "-ms-scroll-chaining". It allows developers to determine the browser's behavior once a scroller has reached its full extent.
The unused delta can be propagated to the parent causing scroll chaining, create a glow/bounce effect without chaining, or just get consumed silently. In particular when used on viewport defining element, it controls if overscroll can be used for navigation actions such as pull-to-refresh or swipe navigation.

overscroll-behavior: auto | contain | none

* `auto`: propagate scroll to the parent scroller. If there is no parent scroller (e.g., viewport) user-agent may perform a default action (e.g. navigation) or show any appropriate overscroll UI affordance. This is the default value.
* `contain`: do not propagate. The user agent may show an appropriate overscroll UI affordance such as bounce or glow.
* `none`: same as contain but also prevents any overscroll UI affordance e.g. bounce or glow.

There will be overscroll-behavior-{x,y} long-hands to control each axis individually.

## Current State
The specification and API has received positive feedback and support from EdgeHTML [1], Mozilla
[2], Chromium[3], and web developers [4,5]. We at Chromium are launching it at M63 and the feature is already in M63-Beta

[1] https://github.com/w3c/csswg-drafts/issues/769#issuecomment-270228948
[2] https://bugzilla.mozilla.org/show_bug.cgi?id=951793#c11
[3] https://groups.google.com/a/chromium.org/d/msg/blink-dev/OqBNF2efmFA/3ByBUKyaCgAJ
[4] https://github.com/w3c/csswg-drafts/issues/769#issuecomment-279832555
[5] https://github.com/w3c/csswg-drafts/issues/769#issuecomment-288878908

** --enable-web-platform-experimental-features or --enable-blink-features=CSSOverscrollBehavior

120 votes
Vote
Sign in
Check!
(thinking…)
Reset
or sign in with
  • facebook
  • google
    Password icon
    Signed in as (Sign out)
    You have left! (?) (thinking…)
    Sandra Sun shared this idea  ·   ·  Flag idea as inappropriate…  ·  Admin →

    2 comments

    Sign in
    Check!
    (thinking…)
    Reset
    or sign in with
    • facebook
    • google
      Password icon
      Signed in as (Sign out)
      Submitting...

      Feedback and Knowledge Base