[CSSOM View] Smooth scroll behavior via CSS property / DOM scroll* API

# Frédéric Wang (2 months ago)

This email is to announce that I have started to work on (programmatic) smooth scrolling in WebKit from the CSSOM View specification [1]. To use this effect, web developers can pass a behavior parameter (auto, smooth, or instant) to Element.scroll, Element.scrollTo, Element.scrollBy, Element.scrollIntoView, Window.scroll, Window.scrollTo or Window.scrollBy [2]. When behavior is auto, the instant/smooth characteristic is actually taken from the value of a new CSS scroll-behavior property [3]. This new feature will be protected by a compile flag (enabled by default) and a runtime flag (an experimental feature). If you are interested, you can follow advancement on Bugzilla [4].

Incidentally (and since that was convenient to do it before) I also added some basic support for new ScrollIntoView options [5] [6] that allow to specify how you want the revealed element to be aligned with respect to its scrollable ancestors.

Cheers,

Frédéric

[1] drafts.csswg.org/cssom-view [2] drafts.csswg.org/cssom-view/#dictdef-scrolloptions [3] drafts.csswg.org/cssom-view/#propdef-scroll-behavior [4] bugs.webkit.org/show_bug.cgi?id=188043 [5] bugs.webkit.org/show_bug.cgi?id=189258 [6] drafts.csswg.org/cssom-view/#dictdef

Contact us to advertise here
# Frédéric Wang (3 hours ago)

The main implementation is now submitted for review at: bugs.webkit.org/show_bug.cgi?id=188043

It has some issue with smooth scrolling via scrollIntoView on nested scrollers but I don't plan to work on this until the main part is merged. See bugs.webkit.org/show_bug.cgi?id=189907

Want more features?

Request early access to our private beta of readable email premium.