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. Spark Streaming简介及原理

    简介: SparkStreaming是一套框架. SparkStreaming是Spark核心API的一个扩展,可以实现高吞吐量的,具备容错机制的实时流数据处理. 支持多种数据源获取数据: Spark ...

  2. vs2017安装

    每次安装包都搞的很大,而且出各式各式的问题. 安装程序清单签名失败 运行'vs_Enterprise.exe'时,出现'安装程序清单签名失败'的错误,直接删除'vs_installer.opc'文件, ...

  3. 算法模板学习专栏之总览(会慢慢陆续更新ing)

    博主欢迎转载,但请给出本文链接,我尊重你,你尊重我,谢谢~http://www.cnblogs.com/chenxiwenruo/p/7495310.html特别不喜欢那些随便转载别人的原创文章又不给 ...

  4. sql-server安装

    ubuntu安装sql-server https://docs.microsoft.com/zh-cn/sql/linux/quickstart-install-connect-ubuntu?view ...

  5. Buy the Ticket HDU 1133

    传送门 [http://acm.hdu.edu.cn/showproblem.php?pid=1133] 题目描述和分析 代码 #include<iostream> #include< ...

  6. Linux常用指令【转载】

    [收藏]Linux常用指令[转载] $ 命令行提示符 粗体表示命令 斜体表示参数 filename, file1, file2 都是文件名.有时文件名有后缀,比如file.zip command 命令 ...

  7. linux及安全第四周总结

    学习内容:使用库函数API和C代码中嵌入汇编代码两种方式使用同一个系统调用 一.用户态.内核态 权限分级——为了系统本身更稳定,使系统不宜崩溃.(并不是所有程序员缩写的代码都很健壮!!) x86 CP ...

  8. 同步手绘板——json

    JSON(JavaScript Object Notation) 是一种轻量级的数据交换格式.它基于ECMAScript的一个子集. JSON采用完全独立于语言的文本格式,但是也使用了类似于C语言家族 ...

  9. 在Java中执行Tomcat中startup.bat

    问题:更改数据库时,需要重启Tomcat服务器,才能把更改后的数据加载到项目中.于是想每次更改数据库时,都调用Java方法,重启Tomcat 代码: Process process = Runtime ...

  10. input file multiple 批量上传文件

    这几天维护系统,有一个批量上传文件功能,出现了一点小问题 我的笔记本选择要上传的文件很正常 但在测试环境上,别人的电脑上,选择上传文件之后 一开始,以为是代码问题,网上找了很多的资料,但还是没用,然后 ...