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』名称冲突使用noConflict方法解决
Apr 22 Javascript
jCallout 轻松实现气泡提示功能
Sep 22 Javascript
JS onmousemove鼠标移动坐标接龙DIV效果实例
Dec 16 Javascript
基于Jquery和CSS3制作数字时钟附源码下载(CSS3篇)
Nov 24 Javascript
基于canvas实现的钟摆效果完整实例
Jan 26 Javascript
通过jquery-ui中的sortable来实现拖拽排序的简单实例
May 24 Javascript
关于js原型的面试题讲解
Sep 25 Javascript
自学实现angularjs依赖注入
Dec 20 Javascript
JavaScript数组去重的6个方法
Jan 21 Javascript
JS实现多张图片预览同步上传功能
Jun 23 Javascript
详解如何使用webpack打包多页jquery项目
Feb 01 jQuery
vue的keep-alive中使用EventBus的方法
Apr 23 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(1) php开发环境配置
2010/02/15 PHP
ThinkPHP应用模式扩展详解
2014/07/16 PHP
php检查字符串中是否有外链的方法
2015/07/29 PHP
Jquery+JSon 无刷新分页实现代码
2010/04/01 Javascript
鼠标选择动态改变网页背景颜色的JS代码
2013/12/10 Javascript
jQuery实现返回顶部功能适合不支持js的浏览器
2014/08/19 Javascript
JavaScript中具名函数的多种调用方式总结
2014/11/08 Javascript
js函数与php函数的区别实例浅析
2015/01/12 Javascript
Node.js开发之访问Redis数据库教程
2015/01/14 Javascript
jquery使用hide方法隐藏指定id的元素
2015/03/30 Javascript
jquery实现全屏滚动
2015/12/28 Javascript
jQuery短信验证倒计时功能实现方法详解
2016/05/25 Javascript
jQuery EasyUI 右键菜单--关闭标签/选项卡的简单实例
2016/10/10 Javascript
EasyUI学习之Combobox下拉列表(1)
2016/12/29 Javascript
微信小程序 五星评价功能的实现
2017/03/09 Javascript
Javascript 一些需要注意的细节(必看篇)
2017/07/08 Javascript
vue-router路由懒加载和权限控制详解
2017/12/13 Javascript
vue学习笔记之slot插槽用法实例分析
2020/02/29 Javascript
[54:02]2018DOTA2亚洲邀请赛 4.1 小组赛 B组 IG vs VGJ.T
2018/04/03 DOTA
Python 从subprocess运行的子进程中实时获取输出的例子
2019/08/14 Python
python lambda表达式(匿名函数)写法解析
2019/09/16 Python
提供世界各地便宜的机票:Sky-tours
2016/07/21 全球购物
美国职棒大联盟的官方手套、球和头盔:Rawlings
2020/02/15 全球购物
给民警的表扬信
2014/01/08 职场文书
商业项目策划方案
2014/06/05 职场文书
校园绿化美化方案
2014/06/08 职场文书
民主评议党员自我评议范文2014
2014/09/26 职场文书
司法工作人员群众路线对照检查材料思想汇报
2014/09/30 职场文书
个人诉讼委托书范本
2014/10/17 职场文书
2014年手术室工作总结
2014/11/26 职场文书
岗位职责范本大全
2015/02/26 职场文书
2015年财务部年度工作总结
2015/05/19 职场文书
六年级上册《闻官军收河南河北》的教学设计
2019/11/15 职场文书
vue+element ui实现锚点定位
2021/06/29 Vue.js
SQL实现LeetCode(175.联合两表)
2021/08/04 MySQL
python文件与路径操作神器 pathlib
2022/04/01 Python