比如 页面中 某个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. Ubuntu 16 Mysql 安装配置

    安装Mysql   apt-get update;   apt-get install mysql-server apt-get install mysql-client //安装过程中会提示修改密码 ...

  2. Parallel类

    Parallel类是对线程很好的一个抽象.该类位于System.Threading.Tasks名称空间中,提供了数据和任务并行性. Parallel类定义了并行的for和foreach的静态方法.Pa ...

  3. RobotFramework+selenium环境安装

    1.安装python 2.7.12 https://www.python.org/downloads/release/python-2712/ 安装完成之后配置好path,将下面的类似安装路径加入pa ...

  4. ue4 3dui材质参数修改

  5. 通俗理解 React 高阶函数

    定义:高阶组件就是一个函数,且该函数接受一个组件作为参数,并返回一个新的组件. A higher-order component is a function that takes a componen ...

  6. [软件工程基础]Alpha 阶段事后分析

    设想和目标 1. 我们的软件要解决什么问题?是否定义得很清楚?是否对典型用户和典型场景有清晰的描述? 帮助选修物理实验的学生撰写实验报告,计算实验数据,验证计算结果,并提供一个讨论的平台. 全体成员认 ...

  7. [TCP/IP]OSI七层模型和TCP/IP四层模型

    OSI參考模型 在過去的電腦網路上,由於資料通訊系統涉及複雜的軟硬體,可是又沒有統一的標準,導致通訊軟體不僅龐大複雜,而且不易測式.修改或分享.為此,ISO(國際標準組織)發展出一套OSI參考模型(O ...

  8. Codeforces 183C(有向图上的环长度)

    因为公用一个系统所以大家求gcd:衡量各点之间的拓扑位置,如果到达同一点有不同的长度则取gcd. #include <cstdio> #include <cstring> #i ...

  9. hdu2466-Shell Pyramid

    先预处理一下层和行所对应的数,然后二分三个答案,注意细节   #include<cstdio> #define inf 0x3f3f3f3f ; typedef __int64 LL; u ...

  10. net core 认证及简单集群

    net core 认证及简单集群 在Asp.net WebAPI中,认证是通过AuthenticationFilter过滤器实现的,我们通常的做法是自定义AuthenticationFilter,实现 ...