demo · v140

all vs nearest

A target buried three scroll containers deep. With container: 'all' (the legacy default) every ancestor scrolls into view, including the document. With container: 'nearest' only the closest scrolling ancestor scrolls — exactly what an in-page TOC usually wants.

padding…

padding…

padding…

target — three containers deep

padding…

padding…

// Only scroll the closest scrolling ancestor.
target.scrollIntoView({ container: "nearest", block: "center" });

// Equivalent to the legacy behaviour:
target.scrollIntoView({ container: "all" });

see also