因为最近在开发angular,自己有路由 用window.location跳到默认路由,查了半天用angular方式不好解决 ,so 原生走起

START

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

EXPLAIN

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

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

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

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

EXAMPLE

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

document.getElementById("view").scrollIntoView(false);
  • 1

END

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

下图展示的是我对scrollIntoView的一种应用

锚点 , angular 锚点 vue锚点的更多相关文章

  1. vue 锚点定位

    vue 锚点定位 <template> <div class="details"> <div class="wrapper w"& ...

  2. Jerry的碎碎念:SAPUI5, Angular, React和Vue

    去年我去一个国内客户现场时,曾经和他们IT部门的一位架构师聊到关于在SAP平台上进行UI应用的二次开发时,UI框架是选用UI5还是Vue这个话题. 我们代表SAP, 向客户推荐使用UI5是基于以下六点 ...

  3. 我从Angular 2转向Vue.js, 也没有选择React

    译者按: 通过使用Angular的经历,作者已经完全转为Vue粉了!我们Fundebug目前还是用AngularJS 1,坦白说,学习曲线蛮陡的. 原文: Why we moved from Angu ...

  4. 【转】前端框架天下三分:Angular React 和 Vue的比较

    前端框架天下三分:Angular React 和 Vue的比较 原文链接:http://blog.csdn.net/haoshidai/article/details/52346865 前端这几年的技 ...

  5. 【repost】前端学习总结(二十三)——前端框架天下三分:Angular React 和 Vue的比较

    目录(?)[+]   前端这几年的技术发展很快,细分下来,主要可以分成四个方面: 1.开发语言技术,主要是ES6&7,coffeescript,typescript等: 2.开发框架,如Ang ...

  6. angular.js和vue.js中实现函数去抖(debounce)

    问题描述 搜索输入框中,只当用户停止输入后,才进行后续的操作,比如发起Http请求等. 学过电子电路的同学应该知道按键防抖.原理是一样的:就是说当调用动作n毫秒后,才会执行该动作,若在这n毫秒内又调用 ...

  7. 前端框架:Angular React 和 Vue的比较

    前端这几年的技术发展很快,细分下来,主要可以分成四个方面: 1.开发语言技术,主要是ES6&7,coffeescript,typescript等: 2.开发框架,如Angular,React, ...

  8. vue锚点

    第一种: router.js中添加 mode: 'history', srcollBehavior(to,from,savedPosition){ if(to.hash){ return { sele ...

  9. Angular React 和 Vue的比较

    Angular(1&2),React,Vue对比 一 数据流 数据绑定 Angular 使用双向绑定即:界面的操作能实时反映到数据,数据的变更能实时展现到界面. 实现原理: $scope变量中 ...

随机推荐

  1. 日期时间函数 mysql 和sqlserver 中对于常用函数的日期和时间函数的区别

    1. sqlserver中获取时间用getdate(),默认返回格式是2019-01-21 13:58:33.053,具体的年月日,时分秒毫米,年月日之间用短线连接,时分秒之间用冒号连接,秒和毫米之间 ...

  2. “ORA-06550: 第 1 行, 第 7 列”解决方法

    将本机能正常运行的维修生产日志代码发布到公司内测环境里无法正常运行,报错如下: execute() - pls–QuartzJob.java–quartzjob 开始执行! java.sql.SQLE ...

  3. [转]QT中QString与string的转化,解决中文乱码问题

    QString str2qstr(const string str) { return QString::fromLocal8Bit(str.data()); } string qstr2str(co ...

  4. Eclipse使用之将Git项目转为Maven项目, ( 注意: 最后没有pom.xml文件的, 要转化下 )

    Eclipse使用之将Git项目转为Maven项目(全图解) 2017年08月11日 09:24:31 阅读数:427 1.打开Eclipse,File->Import 2.Git->Pr ...

  5. Android drag drop

    最近偶尔知道了锤子的one step,所以在网上看相关的东西,有人说android原生drag drop就能实现,我就去学习一下这个drag drop,下面把学习到的东西总结一下: drag drop ...

  6. java类加载器和双亲委派模型

    一. 类加载器 ClassLoader即常说的类加载器,其功能是用于从Class文件加载所需的类,主要场景用于热部署.代码热替换等场景. 系统提供3种的类加载器:Bootstrap ClassLoad ...

  7. 学习笔记26— roc曲线(python)

    一.概念: 准确率(Accuracy), 精确率(Precision), 召回率(Recall)和F1-Measure 机器学习(ML), 自然语言处理(NLP), 信息检索(IR)等领域, 评估(E ...

  8. ubuntu配置chrome git

    安装chrome (也可以直接从官网下载deb包安装) sudo wget http://www.linuxidc.com/files/repo/google-chrome.list -P /etc/ ...

  9. ubuntu 14.04 postgresql 的总结

    1)为了允许远程连接: a) http://askubuntu.com/questions/423165/remotely-access-postgresql-database To open the ...

  10. 20165327 2017-2018-2 《JAVA程序设计》第5周学习总结

    20165327 2017-2018-2 <JAVA程序设计>第5周学习总结 一.第7.10章内容小结 第7章:内部类与异常类 内容小结: 1. Java支持在一个类中声明另一个类,这样的 ...