[csswg-drafts] [css-overscroll-behavior] Inhibiting "scroll chaining" from non user scrollable elements? (#3349)

jonjohnjohnson has just created a new issue for https://github.com/w3c/csswg-drafts:

== [css-overscroll-behavior] Inhibiting "scroll chaining" from non user scrollable elements? ==
https://drafts.csswg.org/css-overscroll-behavior-1

Consider...

```css
body { height: 110vh; }

.scrollport {
  overflow-y: scroll;
  overscroll-behavior-y: none;
  scrollbar-width: none;
}
.scrollbox {
  margin-bottom: -1px;
}
.scrollbox::after {
  content: '';
  display: block;
  height: 1px;
}
.content {
  position: sticky;
  top: 0;
  bottom: 0;
}
```
```html
<scrollport>
  <scrollbox>
    <content>
    </>
  </>
</>
```

...effectively (inefficiently) creates an element which visually doesn't scroll, yet inhibits scrolling from "chaining" up/outside the element vertically.

I know that `overscroll-behavior` is currently most about scroll boundaries and may be a simpler/subset of what was set out for the initial stab at `ms-scroll-chaining`, but when I see...

> Note: This property should provide guarantees that are, at least, as strong as `preventDefault` for preventing both scroll chaining and overscroll. Doing otherwise would cause content authors to use preventDefault instead.

...I wonder if it would be useful to have/specify a simpler (css) way to inhibit scrolling events from certain elements of a ui regardless of scrollability. I know as I develop more native-like web interfaces, I come upon scenarios where I don't have a block that is user scrollable, but would very much like it to not allow scrolling up the document, even if its ancestors participate in scrolling. Especially when chaining in the opposite direction is desired (see touch interface ux), `preventDefault` becomes a bit spicier.

I'd imagine it should definitely be separate than just the current `none` or `contain` values when `overflow` set to `auto` more often than not desires scroll chaining.

With values like `always` for `break-after` maybe an initial suggestion makes sense as...
```css
overscroll-behavior: never
```
...and could then apply to elements that are not scroll containers? Or maybe still require `overflow: hidden`/`clip` even if not user scrollable?

[Demo of example code - Best in current Firefox Nightly](http://jsfiddle.net/m8yfzgds/)

Please view or discuss this issue at https://github.com/w3c/csswg-drafts/issues/3349 using your GitHub account

Received on Tuesday, 27 November 2018 22:31:16 UTC