$('.nav-jump').click(function()
{
$('html,body').animate(
{
scrollTop:$($.attr(this, 'href')).offset().top
}, 800);
});

该代码实现了 所以带.nav-jump class 的<a>标签在点击时能够平滑跳转至 链接所指的页内部分。

调用:

<a class="nav-jump" href="#part-1"><p>描述</p></a>

JQuery 实现 锚点跳转的更多相关文章

  1. jQuery实现锚点跳转(就一行代码)

    /* 锚点跳转 */ function anchor(p,fn) { $("html,body").animate({ scrollTop: $("#" + p ...

  2. jQuery之锚点带动画跳转特效

    背景图片为金木研,这是我最爱的一张图. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" &quo ...

  3. jquery 在页面上根据ID定位(jQuery锚点跳转及相关操作) 经典

    1.锚点跳转简介 Edit 锚点其实就是可以让页面定位到某个位置上的点.在高度较高的页面中经常见到.比如百度的百科页面,wiki中的page内容. 我知道实现锚点的跳转有两种形式,一种是a标签+nam ...

  4. jQuery任意标签锚点跳转插件

    // 任意锚点平滑跳转插件// 2010-07-15 v1.0(function($){ $.fn.zxxAnchor = function(options){ var defaults = { ie ...

  5. jquery 在页面上根据ID定位(jQuery锚点跳转及相关操作)

    JQuery下锚点的平滑跳转 对于锚点的平滑跳转,在一般的商业性质的网站上,权衡来说,要谨慎使用. 例如:让页面平滑滚动到一个id为box的元素处,则JQuery代码只要一句话,关键位置 如下: $( ...

  6. 各种HTML锚点跳转方式

    1 js控制锚点跳转 <a name="anchor"></a> location.hash="anchor"; 不只有a其他元素也可以 ...

  7. 基于jquery的锚点滚动插件(百度百科效果) anchorScroll.js

    1.插进使用场景 请打开https://baike.baidu.com/item/%E6%97%A5%E6%9C%AC%E5%8A%A8%E7%94%BB#hotspotmining,查看百度百科页面 ...

  8. html锚点的作用和js选项卡锚点跳转的使用

    location是javascript里边管理地址栏的内置对象,比如location.href就管理页面的url,用location.href=url就可以直接将页面重定向url.而location. ...

  9. a 锚点跳转滑动效果

    点击a链接时,跳转到相应id的位置处,有一个滑动效果. <a href="#my">我是跳转到div</a><div id="my" ...

随机推荐

  1. Mysql 语句优化技巧

    前言 有人反馈之前几篇文章过于理论缺少实际操作细节,这篇文章就多一些可操作性的内容吧. 注:这篇文章是以 MySQL 为背景,很多内容同时适用于其他关系型数据库,需要有一些索引知识为基础. 优化目标 ...

  2. win10下ndk编译arm可执行体

    编译参考文章 http://blog.csdn.net/john_1984/article/details/12622215 一.编写soLoader主文件 soLoader.c内容: #includ ...

  3. 【博弈论】Nim游戏

    百度百科 Definition 这样的游戏被称为Nim游戏: 1.有两个玩家,轮流进行操作 2.是公平游戏.即面对同一局面两个玩家所能进行的操作是相同的.例如中国象棋不是公平游戏.因为面对同一个局面, ...

  4. [转载]系统管理:update-alternatives

    http://blog.csdn.net/dbigbear/article/details/4398961 好吧,其实博主也是转载的. update-alternatives --display | ...

  5. Kubernetes - Launch Single Node Kubernetes Cluster

    Minikube is a tool that makes it easy to run Kubernetes locally. Minikube runs a single-node Kuberne ...

  6. 在centos中使用rpm安装包安装jenkins

    jenkins下载:http://pkg.jenkins-ci.org/redhat/ 下载rpm包到本地 在linux下使用rpm包安装命令: sudo rpm -ih jenkins-1.562- ...

  7. 耗子学Python了(1)___Python环境配置

    一:写在开始的开始 最近我们团对的老大问我想看什么书,我让老大买了一本<Python 3面向对象编程>,所以在看的时候边敲边实践,决定在自己电脑配置下相应的环境,然后开始Python的学习 ...

  8. 元类编程--property动态属性

    from datetime import date, datetime class User: def __init__(self, name, birthday): self.name = name ...

  9. 【BZOJ】1704: [Usaco2007 Mar]Face The Right Way 自动转身机

    [题意]n头牛,一些向前一些向后,每次可以使连续k头牛转身,求使旋转次数最小的k. [算法]贪心 [题解]这题题解很迷,大概思想是k没有单调性,故枚举k,从左到右扫描遇到一只向后的牛就旋转一次. 贪心 ...

  10. Achain 钱包部署

    官网 GIT: [ Achain_linux ] 基础环境 OS: CentOS, Ubuntu Achain: 官网 [ release 最新版本 ] 安装 Achain 钱包 下载 CentOS ...