scrollIntoView是一个与页面(容器)滚动相关的API(官方解释),该API只有boolean类型的参数能得到良好的支持(firefox 36+都支持),所以在这里只讨论参数Boolean类型的情况。

调用方法为 element.scrollIntoView() 参数默认为true。

参数为true时调用该函数,页面(或容器)发生滚动,使element的顶部与视图(容器)顶部对齐;

参数为false时,使element的底部与视图(容器)底部对齐。

TIPS:页面(容器)可滚动时才有用!

1、document.getElementById("view").scrollIntoView();

2、document.getElementById("view").scrollIntoView(false);

scrollIntoView可以说是URL中hash标记的进化,那么它在什么时候用到呢?想想hash(也就是#xxx)的作用吧!

如下应用

---------------------
作者:何处青山
来源:CSDN
原文:https://blog.csdn.net/hyl94/article/details/77472154
版权声明:本文为博主原创文章,转载请附上博文链接!

scrollIntoView()的用法的更多相关文章

  1. js中scrollIntoView()的用法

    一. 什么是scrollIntoView scrollIntoView是一个与页面(容器)滚动相关的API 二. 如何调用 element.scrollIntoView() 参数默认为true 参数为 ...

  2. 那些移动端web踩过的坑2

    原文链接:https://geniuspeng.github.io/2018/04/26/mobile-issues2/ 坑是无穷无尽的,嗯-长江后坑推前坑~~ 关于音频自动播放 H5的audio标签 ...

  3. 2016年第2周读书笔记与工作笔记 scrollIntoView()与datalist元素

    这一周主要是看了html5网页开发实例与javascript 高级程序设计,供以后翻阅查找.  html5网页开发实例第1章与第二章的2.1部分: 第1章内容: html5在w3c的发展史. 浏览器的 ...

  4. Iframe 用法的详细讲解

    1转自:https://blog.csdn.net/judyge/article/details/51786064 zIframe 用法的详细讲解 把iframe解释成“浏览器中的浏览器“很是恰当 & ...

  5. EditText 基本用法

    title: EditText 基本用法 tags: EditText,编辑框,输入框 --- EditText介绍: EditText 在开发中也是经常用到的控件,也是一个比较必要的组件,可以说它是 ...

  6. jquery插件的用法之cookie 插件

    一.使用cookie 插件 插件官方网站下载地址:http://plugins.jquery.com/cookie/ cookie 插件的用法比较简单,直接粘贴下面代码示例: //生成一个cookie ...

  7. Java中的Socket的用法

                                   Java中的Socket的用法 Java中的Socket分为普通的Socket和NioSocket. 普通Socket的用法 Java中的 ...

  8. [转载]C#中MessageBox.Show用法以及VB.NET中MsgBox用法

    一.C#中MessageBox.Show用法 MessageBox.Show (String) 显示具有指定文本的消息框. 由 .NET Compact Framework 支持. MessageBo ...

  9. python enumerate 用法

    A new built-in function, enumerate() , will make certain loops a bit clearer. enumerate(thing) , whe ...

随机推荐

  1. Calendar类的一些不易区分的属性

    1.Calendar.MONTH 月份从0-11,获取之后需要加1才能得到真正的月份 2.Calendar.DAY_OF_WEEK 本周的第几天,从星期天开始算 3.Calendar.WEEK_OF_ ...

  2. 【 js 算法类】这么全的数组去重,你怕不怕?

    以 var arr = [1,2,3,1]; 作为测试用例 方法一:双循环   (时间复杂度比较高,性能一般.) A.(1) function unique(arr) { var newArr = [ ...

  3. vue input输入框联想

    以下是示例,样式可以自己修改.最后是效果图,其实也挺简单的,主要是用了watch监控input输入值的变化,如果数据是请后端请求可以,先请求数据. <template> <div c ...

  4. NOI.AC NOIP2018 全国热身赛 第四场

    心路历程 预计得分:\(0 + 100 +100\) 实际得分:\(10 + 100 + 0\) 神TM T3模数为啥是\(1e9 + 9\)啊啊啊啊,而且我也确实是眼瞎...真是血的教训啊.. T2 ...

  5. CSS布局之——对齐方式

    一.水平居中: (1). 行内元素的水平居中? 如果被设置元素为文本.图片等行内元素时,在父元素中设置text-align:center实现行内元素水平居中,将子元素的display设置为inline ...

  6. 字符串匹配常见算法(BF,RK,KMP,BM,Sunday)

    今日了解了一下字符串匹配的各种方法. 并对sundaysearch算法实现并且单元. 字符串匹配算法,是在实际工程中经常遇到的问题,也是各大公司笔试面试的常考题目.此算法通常输入为原字符串(strin ...

  7. [iOS] UICollectionView初始化滚动到中间的bug

    转载请保留地址wossoneri.com 问题 首先看一下我之前写的demo:link demo是封装了一个控件,直接在MainViewController的viewWillAppear里初始化,并且 ...

  8. 前端构建工具Gulp使用总结

    1.安装准备 1.1 Node.js安装 在安装Gulp之前首先的安装Node.js, 安装教程详见Node.js 安装配置 1.2 npm安装 在安装node的时候会自动安装npm模块管理器,详见n ...

  9. 常用内置方法之:__str__,__repr__

    class Test(object): def __init__(self): pass def __str__(self): return "test" test = Test( ...

  10. 使用托管快照创建作为 Azure 托管磁盘存储的 VHD 的副本

    创建快照 创建 OS 或数据磁盘 VHD 的快照,以便将其用作备份或用于排查 VM 问题. 快照是 VHD 的完整只读副本. 使用 Azure 门户创建快照 登录到 Azure 门户. 首先在左上角单 ...