scrollIntoView()方法将元素滚动到浏览器窗口的可见区域
2024-09-18 20:00:49
TIPS：容器可滚动时才有用！
语法
element.scrollIntoView（）; // 等同于element.scrollIntoView(true)
element.scrollIntoView（alignToTop）; //布尔参数
element.scrollIntoView（scrollIntoViewOptions）; //对象参数
语法参数
| alignToTop | [可选]，目前之前这个参数得到了良好的支持 |
|---|---|
| true | 元素的顶部将对齐到可滚动祖先的可见区域的顶部。对应于scrollIntoViewOptions: {block: "start", inline: "nearest"}。这是默认值 |
| false | 元素的底部将与可滚动祖先的可见区域的底部对齐。对应于scrollIntoViewOptions: {block: "end", inline: "nearest"}。 |
| scrollIntoViewOptions | [可选]，目前这个参数浏览器对它的支持并不好，可以查看下文兼容性详情 |
|---|---|
| behavior | [可选]定义过渡动画。"auto","instant"或"smooth"。默认为"auto"。 |
| block | [可选] "start"，"center"，"end"或"nearest"。默认为"center"。 |
| inline | [可选] "start"，"center"，"end"或"nearest"。默认为"nearest"。 |
示例
var element = document.getElementById("box");
element.scrollIntoView();
element.scrollIntoView(false);
element.scrollIntoView({block: "end"});
element.scrollIntoView({behavior: "instant", block: "end", inline: "nearest"});
最新文章
- Python_转义字符
- 遍历ModelState中存储的错误信息
- 【SSH 1】SSH框架的基本理解
- 添加favicon.ico网站文件
- 琐碎-关于hadoop2.X那些端口
- 1002 GTY's birthday gift
- js数组的操作 【转】
- 升级NppAstyle中的AstyleLib为最高版本
- <meta http-equiv="pragma" content="no-cache"/>-备
- virtIO驱动安装
- LPC1768的USB-相关结构体定义
- Mysql Explain 参数解释
- mybatis取数据库为null的字段
- SAPUI5 freestyle vs SAP Fiori Elements —— 两种开发SAP UI5 Apps的方式对比
- 字符串匹配KMP算法的讲解C++
- Mybatis框架可视化（1）
- Lua5.1 升级 Lua5.3 升级 小结
- jQuery基础与JavaScript与CSS交互-第五章
- readn.c
- js 原型链 prototype __proto__