比如 页面中 某个DOM, 希望点击按钮后页面直接跳转到 这个DOM所在的位置,

1. 获取DOM离屏幕的高度
 var hTop = $('#box').offset().top;

$('body,html').animate({
  scrollTop:hTop 
},100);

2. 通过原生的方式跳转到某个 地方

var hTopDom = document.getElementById('box');

var hTop = hTopDom.offsetTop;

document.documentElement.scrollTop  = hTop;

跳转的时候没有动画的效果

关于浏览器的 各种高度问题 汇总:

https://blog.csdn.net/semanwmj/article/details/7072795

https://blog.csdn.net/u014304657/article/details/76854064

https://www.cnblogs.com/fnz0/p/5510758.html

JavaScript实现页面到滚动到指定位置执行某些操作的更多相关文章

  1. jquery滚动到指定位置

    利用jquery实现页面可视区滚动到指定位置.直接上代码 //滚动到指定位置 function scrollTo(element,speed) { if(!speed){ speed = 300; } ...

  2. scroll 滚动到指定位置触发事件 and 点击一按钮/链接让页面定位在指定的位置

    scroll 滚动到指定位置触发事件:$(function(){ $(window).scroll(function() { var s =$(window).scrollTop(); if (s&g ...

  3. selenium webdriver——JS滚动到指定位置

    1.DOM滚动方法 1.scrollIntoView(alignWithTop)  滚动浏览器窗口或容器元素,以便在当前视窗的可见范围看见当前元素.如果alignWithTop为true,或者省略它, ...

  4. 利用jquery制作滚动到指定位置触发动画

    <!DOCTYPE html><html><head> <meta charset="utf-8"> <title>利用 ...

  5. 自定义ScrollViewer的Touch事件--触摸上下移动ScrollViewer滚动到指定位置

    double mPointY;//触摸点的Y坐标 double mOffsetY;//滚动条当前位置 bool mIsTouch = false;//是否触摸 //触摸事件 private void ...

  6. 通过scrollTop,使子元素滚动至指定位置

    想实现这样的一个功能,点击子元素,让元素滚动至指定位置,怎么实现呢? 在代码实现之前,先了解下相关关键点. 1.scrollHeight 属性 通过 scrollHeight 属性可获得子元素的滚动高 ...

  7. js滚动到指定位置

    序言:在网络上百度,关键字:“js div滚动到指定位置”,结果基本上大同小异!各种大神都给我们总结出来了四种滚动到指定位置的办法,可惜再下愚钝,每个都不会用,所以写了一个超级简单的方法来使初学者一看 ...

  8. ios开发之--令UITableView滚动到指定位置

    这个应用场景还是挺多的,代码如下: //获取到需要跳转位置的行数 NSIndexPath *scrollIndexPath = [NSIndexPath indexPathForRow: inSect ...

  9. Vue如何引入jquery实现平滑滚动到指定位置效果

    在以往的做法里首选jquery的animate实现,但是Vue里并没有这个方法.如何在Vue项目中实现点击导航平滑滚动到指定位置,为了这效果我是快要崩溃了,上网查阅了很久发现并没有真正意义上解决这个问 ...

随机推荐

  1. Navicat导出数据库结构为PDF

    1.选中需要导出的数据表,右键选择 打印表 2.点击左上角 打印,选择标红的打印机,点击确定,然后键入文件名,确定之后会生成后缀为xps的文件 3.然后打开这个网址(https://xpstopdf. ...

  2. js 正则表达式学习笔记

    正则表达式正则表达式是由一个字符序列形成的搜索模型 语法new RegExp("[abc]")/[abc]//正则表达式主体/修饰符(可选) 1.修饰符i 忽略大小写g 执行全局匹 ...

  3. 最短路(floyd/dijkstra/bellmanford/spaf 模板)

    floyd/dijkstra/bellmanford/spaf 模板: 1. floyd(不能处理负权环,时间复杂度为O(n^3), 空间复杂度为O(n^2)) floyd算法的本质是dp,用dp[k ...

  4. 社交系统ThinkSNS+在研发过程中,如何做到 Laravel 配置可以网站后台配置

    什么是ThinkSNS+ ThinkSNS(简称TS),一款全平台综合性社交系统,为国内外大中小企业和创业者提供社会化软件研发及技术解决方案. 本文分享下利用 Laravel 的 Bootstrapp ...

  5. 在Centos中安装HustOJ实验记录

    hustoj是目前使用最广泛的刷题平台,自建平台是编程教学中重要一环,教,学,测,反思形成闭合回路.目前利用现有的服务器资源,建成了开高开源code中心,一个刷题系统,六月再建一个私有云,私有云不仅是 ...

  6. Oracle共享服务器的连接模式

    一般Oracle数据库安装默认都是选择专用服务器模式的连接方式,但实际上Oracle也支持共享服务器的连接模式,不过这种在实际生产中见到的很少,我个人只在一些医院行业的客户生产环境中见到过这类配置. ...

  7. MyEclipse 2016CI破解版for Mac

    网上的教程很多,一开始怎么都不行,就是不行,也是如此操作,可能是注册机失效了还是怎样,数个小时过去了,我综合了网上的资源,终于OK啦!(我会在文后给出jar 包,注册机的破解文件,以及MyEclips ...

  8. rand()函数的用法

    C++中rand() 函数的用法 1.rand()不需要参数,它会返回一个从0到最大随机数的任意整数,最大随机数的大小通常是固定的一个大整数. 2.如果你要产生0~99这100个整数中的一个随机整数, ...

  9. [Android]解决 Could not read entry xxx from cache taskArtifacts.bin

    Bug 出现 事情是这样的,昨天早晨我正做着项目,坐在我旁边的小伙伴呼唤了我一下,说项目运行不起来了. 我纳闷着,前天的时候还好好的,怎么过了一晚就出问题了.我问他是不是改了什么配置,或者添加了什么东 ...

  10. 题解 P1004 方格取数

    传送门 动态规划Yes? 设i为路径长度,(为什么i这一维可以省掉见下)f[j][k]表示第一个点到了(j,i-j),第二个点到了(k,j-k) 则 int ji=i-j,ki=i-k; f[j][k ...