diff --git a/files/en-us/web/api/element/scrollintoview/index.md b/files/en-us/web/api/element/scrollintoview/index.md index 93dfe9bca11b0b5..abf537837cce61e 100644 --- a/files/en-us/web/api/element/scrollintoview/index.md +++ b/files/en-us/web/api/element/scrollintoview/index.md @@ -18,7 +18,7 @@ visible to the user. ```js-nolint scrollIntoView() scrollIntoView(alignToTop) -scrollIntoView(scrollIntoViewOptions) +scrollIntoView(options) ``` ### Parameters @@ -33,29 +33,40 @@ scrollIntoView(scrollIntoViewOptions) of the visible area of the scrollable ancestor. Corresponds to `scrollIntoViewOptions: {block: "end", inline: "nearest"}`. -- `scrollIntoViewOptions` {{optional_inline}} - {{experimental_inline}} - - : An Object with the following properties: +- `options` {{optional_inline}} + - : An object with the following properties: - `behavior` {{optional_inline}} - - : Determines whether scrolling is instant or animates smoothly. This option is a string which must take one of the following values: + - : Determines whether scrolling is instant or animates smoothly. Its value can be one of the following: - `smooth`: scrolling should animate smoothly - `instant`: scrolling should happen instantly in a single jump - `auto`: scroll behavior is determined by the computed value of {{cssxref("scroll-behavior")}} + + The default is `auto`. + - `block` {{optional_inline}} - - : Defines the vertical alignment of the element within the scrollable ancestor container. This option is a string and accepts one of the following values: + - : Defines the vertical alignment of the element within the scrollable ancestor container. Its value can be one of the following: - `start`: Aligns the element's top edge with the top of the scrollable container, making the element appear at the start of the visible area vertically. - `center`: Aligns the element vertically at the center of the scrollable container, positioning it in the middle of the visible area. - `end`: Aligns the element's bottom edge with the bottom of the scrollable container, placing the element at the end of the visible area vertically. - - `nearest`: Scrolls the element to the nearest edge in the vertical direction. If the element is closer to the top edge of the scrollable container, it will align to the top; if it's closer to the bottom - edge, it will align to the bottom. This minimizes the scrolling distance. - - Defaults to `start`. + - `nearest`: Scrolls the element to the nearest edge in the vertical direction. If the element is closer to the top edge of the scrollable container, it will align to the top; if it's closer to the bottom edge, it will align to the bottom. This minimizes the scrolling distance. + + The default is `start`. + + - `container` {{optional_inline}} + - : Defines the scrollable ancestor container. Its value can be one of the following: + - `all`: All scrollable containers are impacted (including the viewport). + - `nearest`: Only the nearest scrollable container is impacted by the scroll. + + The default is `all`. + - `inline` {{optional_inline}} - - : Defines the horizontal alignment of the element within the scrollable ancestor container. This option is a string and accepts one of the following values: + - : Defines the horizontal alignment of the element within the scrollable ancestor container. Its value can be one of the following: - `start`: Aligns the element's left edge with the left of the scrollable container, making the element appear at the start of the visible area horizontally. - `center`: Aligns the element horizontally at the center of the scrollable container, positioning it in the middle of the visible area. - `end`: Aligns the element's right edge with the right of the scrollable container, placing the element at the end of the visible area horizontally. - `nearest`: Scrolls the element to the nearest edge in the horizontal direction. If the element is closer to the left edge of the scrollable container, it will align to the left; if it's closer to the right edge, it will align to the right. This minimizes the scrolling distance. - - Defaults to `nearest`. + + The default is `nearest`. ### Return value