jQuery实现锚点scoll效果实例分析


Posted in Javascript onMarch 10, 2015

本文实例讲述了jQuery实现锚点scoll效果的方法。分享给大家供大家参考。具体实现方法如下:

$('a[href*=#]').click(function() {

   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;

       var obj = document.documentElement; 

     if (jQuery.browser.safari) 

           obj = document.body

    if (jQuery.browser.msie) 

           obj = 'html';

      $(obj).animate({scrollTop: targetOffset}, 1000);

       return false;

     }

   }

});

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

Javascript 相关文章推荐
浅谈关于JavaScript的语言特性分析
Apr 11 Javascript
innerHTML属性,outerHTML属性,textContent属性,innerText属性区别详解
Mar 13 Javascript
基于JavaScript的操作系统你听说过吗?
Jan 28 Javascript
实践中学习AngularJS表单
Mar 21 Javascript
JavaScript实现清空(重置)文件类型INPUT元素值的方法
Nov 17 Javascript
详解Angular的内置过滤器和自定义过滤器【推荐】
Dec 26 Javascript
node.js程序作为服务并在windows下开机自启动(用forever)
Mar 29 Javascript
详解Vue中watch的高级用法
May 02 Javascript
微信小程序仿微信运动步数排行(交互)
Jul 13 Javascript
vue项目引入ts步骤(小结)
Oct 31 Javascript
vue中实现回车键登录功能
Feb 19 Javascript
vue $router和$route的区别详解
Dec 02 Vue.js
jQuery实现Div拖动+键盘控制综合效果的方法
Mar 10 #Javascript
jQuery仿Flash上下翻动的中英文导航菜单实例
Mar 10 #Javascript
js控制页面的全屏展示和退出全屏显示的方法
Mar 10 #Javascript
Javascript 正则表达式实现为数字添加千位分隔符
Mar 10 #Javascript
jquery+easeing实现仿flash的载入动画
Mar 10 #Javascript
javascript判断css3动画结束 css3动画结束的回调函数
Mar 10 #Javascript
jQuery实现表格颜色交替显示的方法
Mar 09 #Javascript
You might like
Zerg兵种介绍
2020/03/14 星际争霸
自定义PHP分页函数
2006/10/09 PHP
用穿越火线快速入门php面向对象
2012/02/22 PHP
PHP无限分类(树形类)的深入分析
2013/06/02 PHP
PHP 冒泡排序 二分查找 顺序查找 二维数组排序算法函数的详解
2013/06/25 PHP
php下载文件源代码(强制任意文件格式下载)
2014/05/09 PHP
PHP判断FORM表单或URL参数来的数据是否为整数的方法
2016/03/25 PHP
PHP项目多语言配置平台实现过程解析
2020/05/18 PHP
在Windows上安装Node.js模块的方法
2011/09/25 Javascript
JavaScript中的私有/静态属性介绍
2012/07/26 Javascript
关于IE BUG与字符串截取substr的解决办法
2013/04/10 Javascript
jQuery语法高亮插件支持各种程序源代码语法着色加亮
2013/04/27 Javascript
Bootstrap每天必学之滚动监听
2016/03/16 Javascript
jQuery如何获取动态添加的元素
2016/06/24 Javascript
jquery 动态合并单元格的实现方法
2016/08/26 Javascript
JavaScript实现瀑布流以及加载效果
2017/02/11 Javascript
简述vue中的config配置
2018/01/23 Javascript
一文快速详解前端框架 Vue 最强大的功能
2019/05/21 Javascript
优雅的使用javascript递归画一棵结构树示例代码
2019/09/22 Javascript
借助云开发实现小程序短信验证码的发送
2020/01/06 Javascript
在vue中使用echarts(折线图的demo,markline用法)
2020/07/20 Javascript
vue-video-player视频播放器使用配置详解
2020/10/23 Javascript
让你30分钟快速掌握vue3教程
2020/10/26 Javascript
Python中用于去除空格的三个函数的使用小结
2015/04/07 Python
python实现给数组按片赋值的方法
2015/07/28 Python
使用Django和Python创建Json response的方法
2018/03/26 Python
Python中对数组集进行按行打乱shuffle的方法
2018/11/08 Python
10个Python面试常问的问题(小结)
2019/11/20 Python
python sleep和wait对比总结
2021/02/03 Python
花园仓库建筑:Garden Buildings Direct
2018/02/16 全球购物
师范生教师实习自我鉴定
2013/09/27 职场文书
2014年元旦促销活动方案
2014/02/22 职场文书
社区文艺活动方案
2014/08/19 职场文书
试用期解除劳动合同通知书
2015/04/16 职场文书
Redis持久化与主从复制的实践
2021/04/27 Redis
python中mongodb包操作数据库
2022/04/19 Python