jQuery实现平滑滚动到指定锚点的方法


Posted in Javascript onMarch 20, 2015

本文实例讲述了jQuery实现平滑滚动到指定锚点的方法。分享给大家供大家参考。具体如下:

定义好指定的anchor锚点,调用下面的js代码可以让页面平滑的滚动到指定的位置,非常实用,比如返回页面顶部,去往页面底部等功能

// HTML:
// <h1 id="anchor">Lorem Ipsum</h1>
// <p><a href="#anchor" class="topLink">Back to Top</a></p>
$(document).ready(function() {
  $("a.topLink").click(function() {
    $("html, body").animate({
      scrollTop: $($(this).attr("href")).offset().top + "px"
    }, {
      duration: 500,
      easing: "swing"
    });
    return false;
  });
});

希望本文所述对大家的jQuery程序设计有所帮助。

Javascript 相关文章推荐
刷新时清空文本框内容的js代码
Apr 23 Javascript
传递参数的标准方法(jQuery.ajax)
Nov 19 Javascript
新老版本juqery获取radio对象的方法
Mar 01 Javascript
Javascript下IE与Firefox下的差异兼容写法总结
Jun 18 Javascript
浅析JavaScript中的CSS属性及命名规范
Nov 28 Javascript
浅谈jQuery事件绑定原理
Jan 02 Javascript
Javascript中prototype的使用详解
Jun 18 Javascript
浅析Javascript ES6新增值比较函数Object.is
Aug 24 Javascript
jQuery事件用法详解
Oct 06 Javascript
微信小程序 两种滑动方式(横向滑动,竖向滑动)详细及实例代码
Jan 13 Javascript
JQuery 封装 Ajax 常用方法(推荐)
May 21 jQuery
JavaScript工具库MyTools详解
Jan 01 Javascript
jQuery在页面加载时动态修改图片尺寸的方法
Mar 20 #Javascript
jQuery实现页面滚动时动态加载内容的方法
Mar 20 #Javascript
JavaScript控制图片加载完成后调用回调函数的方法
Mar 20 #Javascript
jQuery UI插件自定义confirm确认框的方法
Mar 20 #Javascript
js使用split函数按照多个字符对字符串进行分割的方法
Mar 20 #Javascript
原生Js实现简易烟花爆炸效果的方法
Mar 20 #Javascript
Javascript调用函数方法的几种方式介绍
Mar 20 #Javascript
You might like
使用CodeIgniter的类库做图片上传
2014/06/12 PHP
linux下安装php的memcached客户端
2014/08/03 PHP
PHP清除字符串中所有无用标签的方法
2014/12/01 PHP
简单的php+mysql聊天室实现方法(附源码)
2016/01/05 PHP
php打包网站并在线压缩为zip
2016/02/13 PHP
php 开发中加密的几种方法总结
2017/03/22 PHP
PHP面向对象五大原则之依赖倒置原则(DIP)详解
2018/04/08 PHP
PHP实现负载均衡下的session共用功能
2018/04/17 PHP
PHP开发API接口签名生成及验证操作示例
2020/05/27 PHP
用jquery修复在iframe下的页面锚点失效问题
2014/08/22 Javascript
jquery拖动改变div大小
2017/07/04 jQuery
Node接收电子邮件的实例代码
2017/07/21 Javascript
详谈ES6中的迭代器(Iterator)和生成器(Generator)
2017/07/31 Javascript
[js高手之路]图解javascript的原型(prototype)对象,原型链实例
2017/08/28 Javascript
webpack+vuex+axios 跨域请求数据的示例代码
2018/03/06 Javascript
详解vue 项目白屏解决方案
2018/10/31 Javascript
js作用域和作用域链及预解析
2019/04/11 Javascript
js时间转换毫秒的实例代码
2019/08/21 Javascript
node.JS二进制操作模块buffer对象使用方法详解
2020/02/06 Javascript
详解Vue的七种传值方式
2021/02/08 Vue.js
Python递归遍历列表及输出的实现方法
2015/05/19 Python
Python基于Tkinter的HelloWorld入门实例
2015/06/17 Python
python 实现红包随机生成算法的简单实例
2017/01/04 Python
Python使用matplotlib实现的图像读取、切割裁剪功能示例
2018/04/28 Python
对python添加模块路径的三种方法总结
2018/10/16 Python
python pygame实现挡板弹球游戏
2019/11/25 Python
Spring http服务远程调用实现过程解析
2020/06/11 Python
Django框架实现在线考试系统的示例代码
2020/11/30 Python
工商治理实习生的自我评价
2014/01/15 职场文书
办公设备采购方案
2014/03/16 职场文书
建筑施工安全生产责任书
2014/07/22 职场文书
初中学习计划书范文
2014/09/15 职场文书
环境卫生工作汇报材料
2014/10/28 职场文书
2014年项目经理工作总结
2014/11/24 职场文书
MySQL 表空间碎片的概念及相关问题解决
2021/05/07 MySQL
Elasticsearch 批量操作
2022/04/19 Python