博客主机
A-A+

JQuery锚点链接平滑滚动效果

2014年12月27日 杂七杂八 暂无评论 阅读 287 次
博客主机
  1. $(function(){     
  2.     $('a[href*=#],area[href*=#]').click(function() {  
  3.         if (location.pathname.replace(/^\//, '') == this.pathname.replace(/^\//, '') && location.hostname == this.hostname) {  
  4.             var $target = $(this.hash);  
  5.             $target = $target.length && $target || $('[name=' + this.hash.slice(1) + ']');  
  6.             if ($target.length) {  
  7.                 var targetOffset = $target.offset().top;  
  8.                 $('html,body').animate({  
  9.                     scrollTop: targetOffset  
  10.                 },  
  11.                 1000);  
  12.                 return false;  
  13.             }  
  14.         }  
  15.     });  
  16. })  

这段代码的好处是点击锚点链接平滑滚动到锚点，并且浏览器URL后缀不带有锚点字样，使用的过程中基本不用修改以上代码即可实现。

标签：
博客主机

给我留言