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. HTML标签参考(一)

    hi,小哥哥小姐姐们,我们今天要说的是前端的入门,却也是十分重要的意识的培养哦! • html中的标签数量是很多的,据人统计大概有300个左右,并且每年都会以20-30个的速度增加着,但是这么多的标签 ...

  2. 【代码笔记】iOS-MBProgressHUD+MJ

    一,效果图. 二,工程图. 三,代码. ViewController.m #import "ViewController.h" #import "MBProgressHU ...

  3. Django使用多个数据库

    一.定义数据库 使用Django的多个数据库的第一步是告诉Django将使用的数据库服务器. 这是使用DATABASES设置完成的. 此设置将数据库别名映射到该特定连接的设置字典,该数据库别名是一种在 ...

  4. jQuery中hover方法和toggle方法使用指南

    jQuery提供一些方法(如:toggle)将两种事件效果合并到一起,比如:mouseover.mouseout:keyup.keydown等 1.hover函数 hover(over,out)一个模 ...

  5. drupal常用api

    最短的函数 // 语言字串,除了可以获取对应语言外,还可以设置字串变量.可以是!var, @var或 %var,%var就添加元素外层.@var会过滤HTML,!var会原样输出HTML,%var会添 ...

  6. JavaSE——TCP协议网络编程(一)

    实现客户端与服务端的连接: 创建TCP服务端的 ServerSocket ServerSocket :此类实现服务器套接字.服务器套接字请求通过网络传入,基于该请求执行某些操作,然后可能向请求者返回结 ...

  7. PHPCMS V9开发文档

    内容模块 内容模块PC标签调用说明 模块名:content 模块提供的可用操作 操作名 说明 lists 内容数据列表 relation 内容相关文章 hits 内容数据点击排行榜 category ...

  8. SQLServer 学习笔记之超详细基础SQL语句 Part 12(The End)

    Sqlserver 学习笔记 by:授客 QQ:1033553122 -----------------------接Part 11------------------- 现在,我们希望从 " ...

  9. linux centOS7 设置 redis 开机启动

    1.为了让redis-server能在系统启动时自动运行,需要将redis服务作为守护进程(daemon)来运行,我们回/usr/local/cluster/7000/目录中找到一个redis.con ...

  10. c# 子窗体打开或者切换就最大化

    “用MDI方式打开一个子窗口体后,总是不能最大化显示,明明子窗口体的WindowState设置为Maximized?”,相信有很多人会遇到这的样问题,请按下面的方法设置即可使MDI子窗体最大化:1.把 ...