Chat scroller — anchoring, streaming, prepend

1. The scroll engine keeps the reader anchored while replies stream in below, and hands control back the moment you scroll away.
2. The scroll engine keeps the reader anchored while replies stream in below, and hands control back the moment you scroll away.
3. The scroll engine keeps the reader anchored while replies stream in below, and hands control back the moment you scroll away.
4. The scroll engine keeps the reader anchored while replies stream in below, and hands control back the moment you scroll away.
5. The scroll engine keeps the reader anchored while replies stream in below, and hands control back the moment you scroll away.
6. The scroll engine keeps the reader anchored while replies stream in below, and hands control back the moment you scroll away.
7. The scroll engine keeps the reader anchored while replies stream in below, and hands control back the moment you scroll away.
8. The scroll engine keeps the reader anchored while replies stream in below, and hands control back the moment you scroll away.
9. The scroll engine keeps the reader anchored while replies stream in below, and hands control back the moment you scroll away.
10. The scroll engine keeps the reader anchored while replies stream in below, and hands control back the moment you scroll away.
11. The scroll engine keeps the reader anchored while replies stream in below, and hands control back the moment you scroll away.
12. The scroll engine keeps the reader anchored while replies stream in below, and hands control back the moment you scroll away.

User turns are scroll anchors. The viewport carries scroll-fade-b, scrollbar-thin and hides the scrollbar while autoscrolling.

scroll-fade / scrollbar utilities — usable without the scroller

Row 1
Row 2
Row 3
Row 4
Row 5
Row 6
Row 7
Row 8
Row 9
Row 10
Row 11
Row 12
Row 13
Row 14
Row 15
Row 16
Row 17
Row 18
Row 19
Row 20
Row 21
Row 22
Row 23
Row 24
Row 1
Row 2
Row 3
Row 4
Row 5
Row 6
Row 7
Row 8
Row 9
Row 10
Row 11
Row 12
Row 13
Row 14
Row 15
Row 16
Row 17
Row 18
Row 19
Row 20
Row 21
Row 22
Row 23
Row 24
Row 1
Row 2
Row 3
Row 4
Row 5
Row 6
Row 7
Row 8
Row 9
Row 10
Row 11
Row 12
Row 13
Row 14
Row 15
Row 16
Row 17
Row 18
Row 19
Row 20
Row 21
Row 22
Row 23
Row 24

Left: both edges fade as you scroll (scroll-fade). Middle: bottom edge only, size overridden with scroll-fade-b-16. Right: horizontal (scroll-fade-x).