摘要

滚动到文档中的某个坐标。

语法

window.scrollTo(x-coord,y-coord )

window.scrollTo(options)

参数

  • x-coord 是文档中的横轴坐标。
  • y-coord 是文档中的纵轴坐标。
  • options 是一个包含三个属性的对象:
  1. top 等同于  y-coord
  2. left 等同于  x-coord
  3. behavior  类型String,表示滚动行为,支持参数 smooth(平滑滚动),instant(瞬间滚动),默认值auto,实测效果等同于instant

例子

window.scrollTo( 0, 1000 );

// 设置滚动行为改为平滑的滚动
window.scrollTo({
  top: 1000,
  behavior: "smooth"
});

注意

该函数实际上和 window.scroll是一样的。 相对滚动可以参考 window.scrollBywindow.scrollByLines,和 window.scrollByPages

规范

DOM Level 0 不属于任何标准.

浏览器兼容性

  Desktop Mobile
  Chrome Edge Firefox Internet Explorer Opera Safari Android webview Chrome for Android Edge Mobile Firefox for Android Opera for Android Safari on iOS Samsung Internet
Basic support Full supportYes Full supportYes Full supportYes Full supportYes Full supportYes Full supportYes Full supportYes Full supportYes Full supportYes Full supportYes ? Full supportYes Full supportYes
ScrollToOptionsparameter Full support45 No supportNo Full supportYes No supportNo Full support32 No supportNo Full support45 Full support45 No supportNo Full supportYes Full support32 No supportNo Full supportYes

参考:https://developer.mozilla.org/zh-CN/docs/Web/API/Window/scrollTo

Window.scrollTo()的更多相关文章

  1. Selenium滚动条window.scrollTo和window.scrollBy

    Selenium操作滚动条有两种方法,一种就是window.scrollTo,另一种是window.scrollBy,既然两个都可以用来操作滚动条,那这两个方法有什么区别呢? 1.window.scr ...

  2. window.scrollTo(0,document.body.scrollHeight)

    滑轮到页面底部 左下角window.scrollTo(0,document.body.scrollHeight) 右下角window.scrollTo(document.body.scrollWidt ...

  3. window.scrollTo和window.scrollBy

    scrollTo-- 在窗体中如果有滚动条,将横向滚动条移动到相对于窗体宽度为x个像素的位置,将纵向滚动条移动到相对于窗体高度为y个像素的位置(如果没有滚动条,页面不会发生任何变化) scrollTo ...

  4. JS008. 跳转缓存滚动条高度并返回时过渡动画(window.pageYOffset & window.scrollTo & SessionStorage)

    业务场景 从列表跳转详情页,通过操作返回列表页时,滚动条仍然处于跳转前的高度,并加上 ease-out 的过渡动画. 由于sessionStorage是随页面即关即消的,所以比起VUEX.localS ...

  5. JavaScript(四) Window窗体操作

    window: 属性(值或者子对象):opener:打开当前窗口的源窗口,如果当前窗口是首次启动浏览器打开的,则opener是null,可以利用这个属性来关闭源窗口. 方法(函数):事件(事先设置好的 ...

  6. DOM、Window操作

    一.DOM的基本概念 DOM是文档对象模型,这种模型为树模型:文档是指标签文档:对象是指文档中每个元素:模型是指抽象化的东西. 一.基本语法: 数据类型(字符串,小数,整数,布尔,时间) var, v ...

  7. 9.22 window对象、document对象

    一.window对象: 属性(值或者子对象): opener:打开当前窗口的源窗口,如果当前窗口是首次启动浏览器打开的,则opener是null,可以利用这个属性来关闭源窗口 dialogArgume ...

  8. DOM、Window对象操作

    一.DOM的基本概念 DOM是文档对象模型,这种模型为树模型:文档是指标签文档:对象是指文档中每个元素:模型是指抽象化的东西. 一.基本语法: 数据类型(字符串,小数,整数,布尔,时间) var, v ...

  9. 【使用 DOM】使用 Window 对象

    1. 获取 Window 对象 可以用两种方式获得Window对象.正规的HTML5方式是在Document对象上使用defaultView属性.另一种是使用所有浏览器都支持的全局变量window . ...

随机推荐

  1. leetcode刷题--两数之和(简单)

    一.序言 第一次刷leetcode的题,之前从来没有刷题然后去面试的概念,直到临近秋招,或许是秋招结束的时候才有这个意识,原来面试是需要刷题的,面试问的问题都是千篇一律的,只要刷够了题就差不多了,当然 ...

  2. 团队作业—预则立&&他山之石

    团队作业-预则立&&他山之石 Deadline: 2017.10.24 22:00pm 作业要求 一.确立团队选题,建立和初步熟悉团队git的协作方式.项目后续的代码.文档都要通过gi ...

  3. 为什么swift是面向协议的编程--对面向对象机制的改进

    主要目标是提供抽象能力和解决值类型的多态问题 Actually, Abrahams says, those are all attributes of types, and classes are j ...

  4. apache和nginx结合使用

    1  有时候我们希望将nginx和apache结合起来使用,nginx接受用户的请求,作为请求转发服务器,apache作为后端服务器. 2 配置如下 nginx 中将80端口的请求转发到8000端口上 ...

  5. Linux 平台下 RMAN 全备 和 增量备份 shell 脚本

    转:http://blog.csdn.net/tianlesoftware/article/details/5740630 全备脚本 以 nocatalog 模式为例: Shell 脚本: ##### ...

  6. PHP json_encode 中文乱码

    每天学习一点点 编程PDF电子书.视频教程免费下载:http://www.shitanlife.com/code   在编码过程中.经常会用到json_encode来处理中文.但是.出现一个问题.中文 ...

  7. Python-wxpy继承关系

    聊天对象 通过机器人对象 Bot 的 chats(), friends(),groups(), mps() 方法, 可分别获取到当前机器人的 所有聊天对象.好友.群聊,以及公众号列表. 而获得到的聊天 ...

  8. (5)HomeAssistant 增加设备

    将设备添加到Home Assistant https://www.home-assistant.io/docs/configuration/devices/ configuration.yaml文件 ...

  9. svn离线安装以及配置,管理python自动化脚本

    1.使用源码安装,自己make和install,难度还挺大的,改用对应iso中的rpm安装包来安装 2.iso中的rpm包安装,会存在rpm包之间的依赖的关系 3.这种依赖关系,可以处理,仍然在iso ...

  10. node.js api文档生成

    ApiDoc官网地址为:http://apidocjs.com/在Java中有Swagger及其升级版的Swagger2+Springfox自动生成接口管理文档.而在Node.js中则可以利用ApiD ...