1. /*
  2. 如果滚动页面也是DOM没有解决的一个问题。为了解决这个问题,浏览器实现了一下方法,
  3. 以方便开发人员如何更好的控制页面的滚动。在各种专有方法中,HTML5选择了scrollIntoView()
  4. 作为标准方法。
  5. scrollIntoView()可以在所有的HTML元素上调用,通过滚动浏览器窗口或某个容器元素,
  6. 调用元素就可以出现在视窗中。如果给该方法传入true作为参数,或者不传入任何参数,那么
  7. 窗口滚动之后会让调动元素顶部和视窗顶部尽可能齐平。如果传入false作为参数,调用元素
  8. 会尽可能全部出现在视口中(可能的话,调用元素的底部会与视口的顶部齐平。)不过顶部
  9. 不一定齐平,例如:
  10. //让元素可见
  11. document.forms[0].scrollIntoView();
  12. 当页面发生变化时,一般会用这个方法来吸引用户注意力。实际上,为某个元素设置焦点也
  13. 会导致浏览器滚动显示获得焦点的元素。
  14. 支持该方法的浏览器有 IE、Firefox、Safari和Opera。
  15. */
  16. document.querySelector("#roll1").onclick = function(){
  17. document.querySelector("#roll_top").scrollIntoView(false);
  18. }
  19. document.querySelector("#roll2").onclick = function(){
  20. document.querySelector("#roll_top").scrollIntoView(true);
  21. }

scrollIntoView() 调用元素就可以出现在视窗中的更多相关文章

  1. 一个N*M的矩阵,找出这个矩阵中所有元素的和不小于K的面积最小的子矩阵

    题目描述: 一个N*M的矩阵,找出这个矩阵中所有元素的和不小于K的面积最小的子矩阵(矩阵中元素个数为矩阵面积) 输入: 每个案例第一行三个正整数N,M<=100,表示矩阵大小,和一个整数K 接下 ...

  2. Vue父组件如何调用子组件(弹出框)中的方法的问题

    如果子组件是一个弹出框,只有在触发某个点击事件时弹出框才能出现(也就是说在父组件中的子组件使用上用了v-if),那在父组件上如果不点击弹出框是不能获取到$ref的. 原因就是:引用指向的是子组件创建的 ...

  3. 在由N个元素构成的集合S中,找出最小元素C,满足C=A-B,其中A,B是都集合S中的元素,没找到则返回-1

    package bianchengti; /* * 在由N个元素构成的集合S中,找出最小元素C,满足C=A-B, * 其中A,B是都集合S中的元素,没找到则返回-1 */ public class f ...

  4. Android反射出一个类中的其他类对象并调用其对应方法

    MainActivity如下: package cn.testreflect; import java.lang.reflect.Field; import java.lang.reflect.Met ...

  5. 调用opencv相关函数,从视频流中提取出图片序列&&&&jpg图片序列,转化成avi格式视频

    /************************ @HJ 2017/3/30 参考http://blog.sina.com.cn/s/blog_4b0020f301010qcz.html修改的代码 ...

  6. [PY3]——找出一个序列中出现次数最多的元素/collections.Counter 类的用法

    问题 怎样找出一个序列中出现次数最多的元素呢? 解决方案 collections.Counter 类就是专门为这类问题而设计的, 它甚至有一个有用的 most_common() 方法直接给了你答案 c ...

  7. 找出数字数组中最大的元素(使用Math.max函数)

    从汤姆大叔的博客里看到了6个基础题目:本篇是第1题 - 找出数字数组中最大的元素(使用Match.max函数) 从要求上来看,不能将数组sort.不能遍历.只能使用Math.max,所以只能从java ...

  8. LeetCode 5071. 找出所有行中最小公共元素(Java)

    题目:5071. 找出所有行中最小公共元素 给你一个矩阵 mat,其中每一行的元素都已经按 递增 顺序排好了.请你帮忙找出在所有这些行中 最小的公共元素. 如果矩阵中没有这样的公共元素,就请返回 -1 ...

  9. 用最小的空间复杂度找出一个长度为n的数组且数据中的元素是[0,n-1]中任一个重复的数据。

    用最小的空间复杂度找出一个长度为n的数组且数据中的元素是[0,n-1]中任一个重复的数据. 比如:[1, 2, 3, 3, 2, 2, 6, 7, 8, 9] 中 2 or 3 分析:这道题目,实现比 ...

随机推荐

  1. linux下安装zabbix

    1.安装源:sudo rpm -ivh http://repo.zabbix.com/zabbix/3.2/rhel/6/i386/zabbix-release-3.2-1.el6.noarch.rp ...

  2. servlet的继承关系

    一.servlet的继承关系 1.servlet程序是sun公司开发用于web资源技术,任何一个类只需要实现了servlet接口,那么就可以成为servlet程序 2.继承体系: ---------- ...

  3. Linux安装jdk.18和tomcat8

    JDK1.8的安装 第一步:下载JDK1.8 1.百度搜索jdk1.8,打开属于oracle官网的搜索结果项 2.先点击接受协议选项,然后选择要下载的64位linux版本jdk,直接单击通过浏览器下载 ...

  4. android sdk更新后出现please update ADT to the latest version的解决方法

    参考:https://www.cnblogs.com/wicub/p/3613353.html 把 1.修改android-sdk-windows/tools/lib下的plugin.pro文件,用记 ...

  5. poj 2778 AC自动机+矩阵快速幂

    题目链接:https://vjudge.net/problem/POJ-2778 题意:输入n和m表示n个病毒,和一个长为m的字符串,里面只可以有'A','C','G','T' 这四个字符,现在问这个 ...

  6. max_delay/min_delay和input_delay/output_delay

    今天在使用DC设置随路时钟的时候发现里两个比较容易混淆的设置:max_delay/min_delay和input_delay/output_delay. 1)max_delay/min_delay设置 ...

  7. 用python计算圆周率Π

    一.要求: 1.计算到圆周率后面越多位越好. 2.用进度条显示计算的进度. 3.要求给出圆周率Π的具体计算方法和解释. 二.算法: 1.拉马努金公式: 2.高斯-勒让德公式: 设置初始值: 反复执行以 ...

  8. [转]Cloudera Manager和CDH5.8离线安装

    https://blog.csdn.net/zzq900503/article/details/52982828 https://www.cnblogs.com/felixzh/p/9082344.h ...

  9. oralce 的安装以及plsql的配置的html连接

    https://www.cnblogs.com/xkstudy/p/6400738.html

  10. Google弃用HttpClient 而推荐使用HttpURLConnection的原因

    因为兼容性问题,谷歌不愿意维护HttpClient,而使用HttpURLConnection HttpURLConnection的API包小而简便,更适合安卓 HttpURLConnection能够提 ...