jquery 仿锚点跳转到页面指定位置的实例


Posted in Javascript onFebruary 14, 2017

js 仿锚点跳转到页面指定位置,用的是 offset() 方法

$(document).ready(function(){

 var target_top = $("#qa5").offset().top;
 //$("html,body").animate({scrollTop: target_top}, 1000);  //带滑动效果的跳转
 $("html,body").scrollTop(target_top);

  });

jQuery:

offset():

获取匹配元素在当前视口的相对偏移。

返回的对象包含两个整型属性:top 和 left。此方法只对可见元素有效。

position():

获取匹配元素相对父元素的偏移。

返回的对象包含两个整型属性:top 和 left。为精确计算结果,请在补白、边框和填充属性上使用像素单位。此方法只对可见元素有效。

scrollTop() :

方法设置或返回被选元素的垂直滚动条位置。

提示:当滚动条位于最顶部时,位置是 0。

当用于返回位置时:

该方法返回第一个匹配元素的滚动条的垂直位置。

当用于设置位置时:

该方法设置所有匹配元素的滚动条的垂直位置。

以上这篇jquery 仿锚点跳转到页面指定位置的实例就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
网页禁用右键实现代码(JavaScript代码)
Oct 29 Javascript
JS与框架页的操作代码
Jan 17 Javascript
基于jQuery判断两个元素是否有重叠部分的代码
Jul 25 Javascript
javascript eval(func())使用示例
Dec 05 Javascript
jQuery之Deferred对象详解
Sep 04 Javascript
jquery实现标签上移、下移、置顶
Apr 26 Javascript
简介JavaScript中的push()方法的使用
Jun 09 Javascript
javascript+HTML5自定义元素播放焦点图动画
Feb 21 Javascript
原生JS实现圣旨卷轴展开效果
Mar 06 Javascript
angular.extend方法的具体使用
Sep 14 Javascript
微信小程序之页面跳转和参数传递的实现
Sep 29 Javascript
js里面的变量范围分享
Jul 18 Javascript
js replace()去除代码中空格的实例
Feb 14 #Javascript
在js代码拼接dom对象到页面上去的模板总结(必看)
Feb 14 #Javascript
jquery封装插件时匿名函数形参和实参的写法解释
Feb 14 #Javascript
js实现数组去重方法及效率?Ρ? target=
Feb 14 #Javascript
jQuery实现Table表格隔行变色及高亮显示当前选择行效果示例
Feb 14 #Javascript
微信小程序小组件 基于Canvas实现直播点赞气泡效果
May 29 #Javascript
Bootstrap中data-target 到底是什么
Feb 14 #Javascript
You might like
php实现修改新闻时删除图片的方法
2015/05/12 PHP
php动态函数调用方法
2015/05/21 PHP
WordPress中获取所使用的模板的页面ID的简单方法
2015/12/31 PHP
PHP完全二叉树定义与实现方法示例
2017/10/09 PHP
一个基于jquery的图片切换效果
2010/07/06 Javascript
jquery ui resizable bug解决方法
2010/10/26 Javascript
node.js中的fs.link方法使用说明
2014/12/15 Javascript
深入理解angularjs过滤器
2016/05/25 Javascript
AngularJS 整理一些优化的小技巧
2016/08/18 Javascript
利用Angularjs和Bootstrap前端开发案例实战
2016/08/27 Javascript
jquery radio 动态控制选中失效问题的解决方法
2018/02/28 jQuery
微信小程序中的canvas 文字断行和省略号显示功能的处理方法
2018/11/14 Javascript
vue项目中使用fetch的实现方法
2019/04/25 Javascript
浅谈一种让小程序支持JSX语法的新思路
2019/06/16 Javascript
pageGroup.js实现分页功能
2019/07/27 Javascript
node实现简单的增删改查接口实例代码
2019/08/22 Javascript
JavaScript简单编程实例学习
2020/02/14 Javascript
js实现验证码功能
2020/07/24 Javascript
python获取局域网占带宽最大3个ip的方法
2015/07/09 Python
Django框架中的对象列表视图使用示例
2015/07/21 Python
Python3连接MySQL(pymysql)模拟转账实现代码
2016/05/24 Python
numpy 计算两个数组重复程度的方法
2018/11/07 Python
Python函数中不定长参数的写法
2019/02/13 Python
Python range、enumerate和zip函数用法详解
2019/09/11 Python
使用Python获取当前工作目录和执行命令的位置
2020/03/09 Python
python 获取剪切板内容的两种方法
2020/11/28 Python
如何让pre和textarea等HTML元素去掉滚动条自动换行自适应文本内容高度
2019/08/01 HTML / CSS
物理系毕业生自荐信
2013/11/01 职场文书
人力资源部培训专员岗位职责
2014/01/02 职场文书
手术室护士长竞聘书
2014/03/31 职场文书
捐助倡议书范文
2014/04/15 职场文书
调研汇报材料范文
2014/08/17 职场文书
2015年留守儿童工作总结
2015/05/22 职场文书
廉洁自律心得体会2016
2016/01/13 职场文书
2019年教师节活动策划方案
2019/09/09 职场文书
吃通javascript正则表达式
2021/04/21 Javascript