ScrollToOptions

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:

特性

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);
});
					

规范

规范 状态 Comment
CSS Object Model (CSSOM) View Module
The definition of 'ScrollToOptions' in that specification.
工作草案

浏览器兼容性

更新 GitHub 上的兼容性数据
Desktop Mobile
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

图例

完整支持
完整支持
不支持
不支持
见实现注意事项。