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 相关文章推荐
jquery库或JS文件在eclipse下报错问题解决方法
Apr 17 Javascript
Jquery的each里用return true或false代替break或continue
May 21 Javascript
ext combobox动态加载数据库数据(附前后台)
Jun 17 Javascript
运行Node.js的IIS扩展iisnode安装配置笔记
Mar 02 Javascript
javascript实现简单的省市区三级联动
May 14 Javascript
基于JavaScript实现定时跳转到指定页面
Jan 01 Javascript
教你如何终止JQUERY的$.AJAX请求
Feb 23 Javascript
利用jquery实现实时更新歌词的方法
Jan 06 Javascript
canvas实现图像截取功能
Feb 06 Javascript
javascript设计模式 ? 组合模式原理与应用实例分析
Apr 14 Javascript
浅谈js数组splice删除某个元素爬坑
Oct 14 Javascript
vue3.0 自适应不同分辨率电脑的操作
Feb 06 Vue.js
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
dedecms 批量提取第一张图片最为缩略图的代码(文章+软件)
2009/10/29 PHP
PHP中使用匿名函数操作数据库的例子
2014/11/17 PHP
PHP文件读写操作相关函数总结
2014/11/18 PHP
PHP实现求解最长公共子串问题的方法
2017/11/17 PHP
基于JQuery的密码强度验证代码
2010/03/01 Javascript
jQuery的学习步骤
2011/02/23 Javascript
js整数字符串转换为金额类型数据(示例代码)
2013/12/26 Javascript
BootStrap 附加导航组件
2016/07/22 Javascript
实例分析浏览器中“JavaScript解析器”的工作原理
2016/12/12 Javascript
那些精彩的JavaScript代码片段
2017/01/12 Javascript
JQuery实现定时刷新功能代码
2017/05/09 jQuery
Nodejs实现多房间简易聊天室功能
2017/06/20 NodeJs
Angular4 中内置指令的基本用法
2017/07/31 Javascript
nodejs创建简易web服务器与文件读写的实例
2017/09/07 NodeJs
vue实现长图垂直居上 vue实现短图垂直居中
2017/10/18 Javascript
Angular5升级RxJS到5.5.3报错:EmptyError: no elements in sequence的解决方法
2018/04/09 Javascript
基于 jQuery 实现键盘事件监听控件
2019/04/04 jQuery
React中获取数据的3种方法及优缺点
2020/02/18 Javascript
如何在JavaScript中等分数组的实现
2020/12/13 Javascript
JavaScript实现原型封装轮播图
2020/12/27 Javascript
python局部赋值的规则
2013/03/07 Python
Python的高级Git库 Gittle
2014/09/22 Python
python微信跳一跳游戏辅助代码解析
2018/01/29 Python
Python OpenCV中的resize()函数的使用
2019/06/20 Python
linux下安装python3和对应的pip环境教程详解
2019/07/01 Python
python使用opencv实现马赛克效果示例
2019/09/28 Python
如何基于python生成list的所有的子集
2019/11/11 Python
Python3 利用face_recognition实现人脸识别的方法
2020/03/13 Python
用Python 执行cmd命令
2020/12/18 Python
Nobody Denim官网:购买高级女士牛仔裤
2021/03/15 全球购物
大学生职业生涯规划范文
2014/01/08 职场文书
国家机关领导干部民主生活会对照检查材料思想汇报
2014/09/17 职场文书
公司新人试用期自我评价
2014/09/17 职场文书
研究生简历自我评
2015/03/11 职场文书
学校开除通知书
2015/04/25 职场文书
赤壁观后感(2)
2015/06/15 职场文书