锚点跳转的过渡效果

简介:

CSS实现:http://stackoverflow.com/questions/17631417/css-pure-css-scroll-animation

jq实现:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
$( function  () {
     $( 'a[href*=#],area[href*=#]' ).click( function  () {
         console.log( this .pathname)
         if  (location.pathname.replace(/^\ //, '') == this.pathname.replace(/^\//, '') && location.hostname == this.hostname) {
             var  $target = $( this .hash);
             $target = $target.length && $target || $( '[name='  this .hash.slice(1) +  ']' );
             if  ($target.length) {
                 var  targetOffset = $target.offset().top;
                 $( 'html,body' ).animate({
                     scrollTop: targetOffset
                 },
                         1000);
                 return  false ;
             }
         }
     });
});

  


本文转自毒逆天博客园博客,原文链接:http://www.cnblogs.com/dunitian/p/5314749.html,如需转载请自行联系原作者

相关文章
|
移动开发 前端开发 安全
最强大的 iOS 应用源码保护工具:Ipa Guard,保护你的商业机密代码
最强大的 iOS 应用源码保护工具:Ipa Guard,保护你的商业机密代码
|
存储 NoSQL 网络安全
修改mongodb的连接参数
在MongoDB中,你可以通过连接字符串(connection string)来配置连接参数。连接字符串是一个包含连接信息的字符串,可以包括主机地址、端口、认证信息、数据库名等。 下面是一些常见的连接参数,你可以根据需要进行修改: 1. **主机地址(host):** MongoDB服务器的地址。可以是IP地址或主机名。 ```mongodb mongodb://localhost:27017 ``` 2. **端口号(port):** MongoDB服务器的端口号。默认端口号是27017。 ```mongodb mongodb://localhost:
742 1
|
10月前
|
存储 前端开发 API
HarmonyOSNext 端云一体化(5)
本文介绍了 HarmonyOS Next 中客户端操作云存储的详细方法,涵盖云存储基础、环境准备及核心 API 使用。首先讲解了云存储的概念、免费配额与计费策略,接着说明如何在 AGC 平台开通云存储并初始化实例。核心功能包括文件上传(`uploadFile`)、云端文件列表查看(`list`)、元数据获取(`getMetadata`)、下载地址获取(`getDownloadURL`)、文件下载(`downloadFile`)和文件删除(`deleteFile`)。文中还强调了操作时需注意的事项,如文件路径限制和错误处理。通过学习,开发者可掌握云存储的基本操作,满足应用开发中的文件存储需求。
364 9
HarmonyOSNext 端云一体化(5)
|
10月前
|
数据可视化 数据挖掘 BI
Quick BI 深度体验:数据洞察,触手可及——打造智能零售分析利器
作为一名数据分析师,我深度体验了阿里云Quick BI。这是一款功能强大的全场景BI平台,支持多数据源接入与智能分析,操作简单且智能化程度高。通过上传Excel文件即可快速生成数据集,并利用丰富图表进行可视化分析。其“智能小Q助手”可对话式查询数据、自动生成报表,极大降低分析门槛。尽管新手引导和移动端体验尚有优化空间,但Quick BI无疑是企业实现数据驱动决策的有力工具。强烈推荐给希望提升业务竞争力的企业!
|
10月前
|
自然语言处理 PHP SEO
WordPress文章自动标签插件
文章自动标签插件可为文章智能生成标签并添加标签链接。支持PHP、SCWS及结巴分词,可设置字段、最少字数与语言限制,还支持SEO优化和自定义标签类型。注意事项包括仅无标签时生成,且结巴分词需更多内存。更新内容含新增分词方式与绑定功能,截图展示设置界面与效果。
339 0
|
存储 C语言
用加法器实现补码的加/减运算
用加法器实现补码的加/减运算
859 0
|
小程序 数据库
一分钟教你学会小程序云开发的数据库的增删改查
本文简要介绍了小程序云开发中数据库的增删改查操作。首先展示了查询代码,通过`wx.cloud.database().collection().get()`获取数据;接着演示添加数据,强调数据字段需与数据库匹配;然后说明删除数据需基于_id,通过`doc(id).remove()`执行;最后,更新数据同样依赖_id,使用`doc(id).update()`进行修改。
539 1
|
Java 数据库连接 数据库
Mybatis-Pagehelper详细解析及优化插件开发
项目数据库数据量较大,分页查询要很久,所以要对分页优化,项目使用的分页是mybatis的Pagehelper,于是在Pagehelper的基础上进行了本次分页查询的优化
|
缓存 前端开发 API
toapi,一个强大的 Python Web API库!
toapi,一个强大的 Python Web API库!
369 5