在此页

• 特性
• 范例
• 规范
• 浏览器兼容性
• 相关话题

ScrollToOptions dictionary of the CSSOM View spec contains properties specifying where an element should be scrolled to, and whether the scrolling should be smooth.

A ScrollToOptions dictionary can be provided as a parameter for the following methods:

• Window.scroll()
• Window.scrollBy()
• Window.scrollTo()
• Element.scroll()
• Element.scrollBy()
• Element.scrollTo()

特性

ScrollToOptions.top

Specifies the number of pixels along the Y axis to scroll the window or element.

ScrollToOptions.left

Specifies the number of pixels along the X axis to scroll the window or element.

ScrollToOptions.behavior

Specifies whether the scrolling should animate smoothly, or happen instantly in a single jump. This is actually defined on the ScrollOptions dictionary, which is implemented by ScrollToOptions .

范例

In our scrolltooptions example ( see it live ) we include a form that allows the user to enter three values — two numbers representing the left and top properties (i.e. the positions to scroll to along the X and Y axes), and a checkbox indicating whether they want smooth scrolling enabled or not.

When the form is submitted, an event handler is run that puts the entered values into a ScrollToOptions dictionary, and then invokes the Window.ScrollTo() method, passing the dictionary as a parameter:

form.addEventListener('submit', (e) => {
  e.preventDefault();
  var scrollOptions = {
    left: leftInput.value,
    top: topInput.value,
    behavior: scrollInput.checked ? 'smooth' : 'auto'
  }
  window.scrollTo(scrollOptions);
});
					

规范

规范	状态	注释
CSSOM (CSS 对象模型) 视图模块 The definition of 'ScrollToOptions' in that specification.	工作草案

浏览器兼容性

The compatibility table on this page is generated from structured data. If you'd like to contribute to the data, please check out https://github.com/mdn/browser-compat-data and send us a pull request. 更新 GitHub 上的兼容性数据

	桌面						移动
	Chrome	Edge	Firefox	Internet Explorer	Opera	Safari	Android webview	Chrome for Android	Firefox for Android	Opera for Android	Safari on iOS	Samsung Internet
ScrollToOptions	Chrome 45	Edge 79	Firefox Yes	IE 不支持 No	Opera 32	Safari Yes	WebView Android 45	Chrome Android 45	Firefox Android Yes	Opera Android 32	Safari iOS Yes	Samsung Internet Android 5.0
behavior	Chrome 45	Edge 79	Firefox Yes	IE 不支持 No	Opera 32	Safari Yes 注意事项 Yes 注意事项 Safari does not have support for the smooth scroll behavior.	WebView Android 45	Chrome Android 45	Firefox Android Yes	Opera Android 32	Safari iOS Yes 注意事项 Yes 注意事项 Safari does not have support for the smooth scroll behavior.	Samsung Internet Android 5.0
left	Chrome 45	Edge 79	Firefox Yes	IE 不支持 No	Opera 32	Safari Yes	WebView Android 45	Chrome Android 45	Firefox Android Yes	Opera Android 32	Safari iOS Yes	Samsung Internet Android 5.0
top	Chrome 45	Edge 79	Firefox Yes	IE 不支持 No	Opera 32	Safari Yes	WebView Android 45	Chrome Android 45	Firefox Android Yes	Opera Android 32	Safari iOS Yes	Samsung Internet Android 5.0

图例

完整支持

完整支持

不支持

不支持

见实现注意事项。

元数据

• 最后修改： Aug 21, 2019

相关话题

1. ScrollToOptions
2. 特性

   1. behavior
   2. left
   3. top