This set of examples demonstrates usage of the promise-returning versions of the Window and Element scroll methods. In each case, the promise can be used to respond to a scroll operation finishing, which is useful for smooth scrolling operations (for example, created using the scroll-behavior CSS property).
Element.scroll(), Element.scrollBy(), Element.scrollIntoView(), and Element.scrollTo(). See the element methods demo live.Window.scroll(), Window.scrollBy(), and Window.scrollTo(). See the window methods demo live.In both cases, scroll-behavior: smooth is set on the scrolling element to implement smooth scrolling operations. Each button event handler applies a fade-out animation to the toolbar, then scrolls the content, then applies a fade-in animation to the toolbar once the scroll operation promise resolves. The result is that toolbar fades out when a button is pressed, then fades in again once scrolling is finished.