Changes between Version 3 and Version 4 of Scrolling
- Timestamp:
- Feb 17, 2019, 4:32:58 PM (6 years ago)
Legend:
- Unmodified
- Added
- Removed
- Modified
-
Scrolling
v3 v4 11 11 == Scrolling features 12 12 13 == Scrolling and RTL 13 === Momentum 14 15 After a swipe on the trackpad or iOS screen, the content continues to scroll for a while before decelerating to a stop. This is implemented outside of WebKit, by synthetic mouse wheel events on macOS, and by UIScrollView on iOS. 14 16 15 17 === Rubber-banding ("bouncing") 16 18 19 Rubber-banding is what happens when you reach the extent of a scrollable area. On macOS and iOS, you get a bouncing effect. This is implemented by ScrollController on macOS, and by native UIScrollViews on iOS. Note that while pulling down, the scroll position becomes negative. We expose these negative values to web content, and pages sometimes get confused by them. 20 17 21 === Latching 22 23 Latching describes the fact that during a single scroll interaction, only one scrollable area moves. If, in one gesture, you hit the scrollable extent, we don't start scrolling the containing scroller in that gesture. Instead, we'll rubber-band, and the user has to start a new gesture to get the enclosing scroller to scroll. 18 24 19 25 === Scroll snapping 20 26 27 Scroll-snapping is a [CSS feature https://www.w3.org/TR/css-scroll-snap-1/] that allows authors to make a scroller have paging behavior, or anchoring to specific elements. It applies to both page and overflow scrolling. 28 21 29 === Touch-action 22 30 31 The [touch-action https://w3c.github.io/pointerevents/#the-touch-action-css-property] CSS property determines whether touch input MAY trigger default behavior supplied by user agent. It's impact on scrolling is that it may cause scrolling to lock to an axis. 32 33 == Scrolling and RTL 34 35 In RTL documents, scroll position is not a simple positive value. Documents have a scroll origin that is at the top left of the initial containing block, and the scroll position describes the offset of that point from the top left of the viewport (this is a simplification 23 36 24 37 25 == Coordinated scrolling38 == Coordinated ("async") scrolling 26 39 27 40 … … 38 51 Node unparenting and reparenting 39 52 40 === =ScrollingTree53 === ScrollingTree