scrollIntoView(alignWithTop) 是html5新特性中的一个元素，他主要是指滚动浏览器窗口或容器元素，以便在当前视窗的可见范围看见当前元素。
alignWithTop是true或者是false哦。如果alignWithTop为true，或者省略它，窗口会尽可能滚动到自身顶部与元素顶部平齐。
我们见动图

见代码

scrollIntoView还可以实现类似于我们常见的tab切换的效果

一些具体的效果见动图

代码如下

使用scrollIntoView实现tab切换和直接使用jq实现tab切换会有什么区别呢？我们来看一下jq中是怎么实现tab切换的吧~~~
首先见动图

我们再看看实现的代码吧~


scrollIntoView实现tab切换与tab切换这两种方法，其实区别就是scrollIntoView切换的内容在html页面流上是存在的，
而tab切换的内容是不存在的，只有切换的时候才会出现。

关于scrollintoview()真的是有意思极了，结合普通tab切换一起看看的更多相关文章

  1. Java-学习-喜欢-品牌：互联网公司成为动物园，拟人化品牌形象真的那么有意思？

    ylbtech-Java-学习-喜欢-品牌:互联网公司成为动物园,拟人化品牌形象真的那么有意思?  1.返回顶部 1. 当我们在思考如何在这个碎片化.多元化的时代找到真实的.不被标签的自我时,互联网中 ...

  2. unity3D-iOS工程整合爬过的坑~

    unity3D-iOS工程整合爬过的坑~ 好久好久没有写博了~ 最近换了一份有意思的新工作,也是当下最热门的新技术,AR技术.笔者之前一直是做iOS开发的,接触了一门全新的技术,兴奋了好久好久,笔者也 ...

  3. 有了门面，程序会更加体面！- pos软件基于三层架构 -09

    续上篇)        大鸟说道:“实际上没有学过设计模式去理解三层架构会有失偏颇的,毕竟分层是更高一级别的模式,所谓的架构模式.不过在程序中,有意识的遵循设计原则,却也可以有效的做出好的设计.”   ...

  4. 28个Unix/Linux的命令行神器_转

    28个Unix/Linux的命令行神器 下面是Kristóf Kovács收集的28个Unix/Linux下的28个命令行下的工具,有一些是大家熟悉的,有一些是非常有用的,有一些是不为人知的.这些工具 ...

  5. PAT树_层序遍历叶节点、中序建树后序输出、AVL树的根、二叉树路径存在性判定、奇妙的完全二叉搜索树、最小堆路径、文件路由

    03-树1. List Leaves (25) Given a tree, you are supposed to list all the leaves in the order of top do ...

  6. Git分支的前世今生

    摘自Jack__CJ  CSDN博客,写得很好,保存一下. 导读 几乎所有的版本控制系统都以某种形式支持分支. 使用分支意味着你可以把你的工作从开发主线上分离开来,以免影响开发主线. 在很多版本控制系 ...

  7. i love matlab

    新手上路~话说图像修复熟么的真的很有意思~忽的想起NG讲的一个笑话:它让我赚了很多钱,买了车子,买了房子,so what's that? It's Matlab <(￣3￣)> 前两天一直 ...

  8. 【javascript激增的思考02】模块化与MVC

    前言 之前我们遇到了这么一个项目,也就是我们昨天提到的,有很多的小窗口的,昨天说的太抽象了,今天我们再来理一理什么是小窗口(后面点说下),当时由于js有一点复杂,我自己也装B跟风用了一下传说中MVC! ...

  9. 由SimpleAyncTaskExecutor到ListenableFutureTask

    Spring AsyncExecutor观后感 导语 本来想看下spring关于Async&Sync TaskExecutor的主要内容,看着看着发现ListenableTaskExecuto ...

随机推荐

  1. Windows10 家庭版 Docker的安装

    Docker的安装 1.简介:Docker 是一个开源的应用容器引擎,让开发者可以打包他们的应用以及依赖包到一个可移植的容器中, 然后发布到任何流行的 Linux 机器上,也可以实现虚拟化.容器是完全 ...

  2. 阿里云OSS下载pdf文件,并在pdf文件上添加水印

    代码: 兵马未动,粮草先行 作者: 传说中的汽水枪 如有错误,请留言指正,欢迎一起探讨. 转载请注明出处. 公司要求从阿里云OSS下载pdf文件并且需要添加水印. 因此这里总结一下. 首先添加了一个F ...

  3. Uniform Generator HDU1014

    题意 给你公式seed(x+1) = [seed(x) + STEP] % MOD ,输入step和mod, 问你是否可以从第一项0,算到mod,它们是否都不同 是 good choice 否则 ba ...

  4. 2-Twenty third Scrum Meeting-20151229

    前言 因为服务器关闭至今,我们的开发项目也遭遇停滞一个星期.与网站开发负责人员协商之后,今天继续开放服务器.我们的项目也能够继续下去.比规定的开发时间(截止为2015/12/29)推迟,因此我们今天又 ...

  5. Java Script正则表达式语法学习

    今天在做页面交互验证时,在HTML里面第一反应居然用了Java 处理正则表达式的语法... ---------------------------------题记 学习来源 http://www.ru ...

  6. FZU软工实践–团队成员交换交接情况

    0.前言 本次交接主要是为了之后Beta冲刺工作可以更加顺利而进行的.因为我跟其他队友交互不够方便,而且我们项目当前比较缺做前端的人员,后端功能已基本实现.所以我换出来了.希望大家可以顺顺利利做完一步 ...

  7. 我的集合学习笔记--LinkedList

    一,Node节点: /** * 存储元素基本单位 */ public class Node { Object data; Node pre; Node next; public Node(Node p ...

  8. node的router路由。

    使用router可以实现一个小型的express. router继承了大部分的app = express()的方法. 使用router可以工程化管理项目.router使用以后app只能在最开始去存在. ...

  9. [转帖新闻]Windows 7时代即将终结：曾有多辉煌 如今就有多凄凉

    Windows 7时代即将终结:曾有多辉煌 如今就有多凄凉 投递人 itwriter 发布于 2019-01-18 10:47 评论(4) 有834人阅读 [收藏] « » 文/屠敏 来源:CSDN( ...

  10. Delphi之Exception获得错误信息（简单好理解）

    Delphi之Exception获得错误信息 相关资料: http://www.cnblogs.com/hackpig/archive/2010/02/15/1668547.html 实例代码: 1 ...