NavigateEvent: scroll() method
Baseline 2026Newly available
Since January 2026, this feature works across the latest devices and browser versions. This feature might not work in older devices or browsers.
Thescroll() method of theNavigateEvent interface can be called to manually trigger the browser-driven scrolling behavior that occurs in response to the navigation, if you want it to happen before the navigation handling has completed.
In this article
Syntax
scroll()Parameters
None.
Return value
None (undefined).
Exceptions
InvalidStateErrorDOMExceptionThrown if the current
Documentis not yet active, or if the navigation has been cancelled.SecurityErrorDOMExceptionThrown if the event was dispatched by a
dispatchEvent()call, rather than the user agent.
Examples
>Handling scrolling usingscroll()
In this example of intercepting a navigation, thehandler() function starts by fetching and rendering some article content, but then fetches and renders some secondary content afterwards. It makes sense to scroll the page to the main article content as soon as it is available so the user can interact with it, rather than waiting until the secondary content is also rendered. To achieve this, we have added ascroll() call between the two.
navigation.addEventListener("navigate", (event) => { if (shouldNotIntercept(navigateEvent)) { return; } const url = new URL(event.destination.url); if (url.pathname.startsWith("/articles/")) { event.intercept({ async handler() { const articleContent = await getArticleContent(url.pathname); renderArticlePage(articleContent); event.scroll(); const secondaryContent = await getSecondaryContent(url.pathname); addSecondaryContent(secondaryContent); }, }); }});Specifications
| Specification |
|---|
| HTML> # dom-navigateevent-scroll-dev> |