demo · v144
Input Modes Lab
Three input modes — wheel, touch, keyboard — sharing one nested scroll container. Set overscroll-behavior once on the inner scroller and confirm every input mode respects it. Pre-144 keyboard alone leaked past the boundary; v144 closes the gap.
overscroll-behavior: checking…
focus the inner area, then try ↓ PageDown, mouse wheel, or touch — the stats track which input fired and whether scroll chained.
outer content above
inner scroller — click here to focus, then try every input mode.
Line 1
Line 2
Line 3
Line 4
Line 5
Line 6
Line 7
Line 8
Line 9
Line 10
Line 11
Line 12
Line 13
Line 14
Line 15
(scroll all the way down)
outer content below
- last input
- —
- inner pos
- 0px
- outer pos
- 0px
- chained?
- no
the API
.scroller {
overscroll-behavior: contain; /* now applies to KEYBOARD scrolls too */
}
/* before Chrome 144: arrow / PageDown at the inner scroller's bottom
chained scroll to the parent. wheel + touch already obeyed. */