对于锚点的平滑跳转，我觉得要谨慎使用，在个人站点或是这个效果含有功能提示可以用一用，在一般的商业性质的网站上，权衡来讲，不用更好，当然，这只是我的个人意见。jQuery库已经为我们做了很多的工作了，所以，在jQuery下实现锚点的平滑跳转是简单轻松的。例如，我们要让页面平滑滚动到一个id为box的元素处，则jQuery代码只要一句话，如下：
$("html,body").animate({scrollTop: $("#box").offset().top}, 1000);
其中animate为jQuery自定义动画方法，$(“#box”).offset().top表示id为box的jQuery对象距离页面顶部的偏移值，1000表示平滑动画执行的时间为1000毫秒，也就是1秒。
为了直观的表示效果，我做个个简单的demo页面。您可以狠狠地点击这里：锚点平滑跳转demo
点击下图所示文字链接，就可以看到平滑跳转效果了：
相应的代码如下：
HTML部分<div> 平滑跳转到底部：<a href="#bottom">滑到底部</a></div><div> <img src="https://ss4.sinaimg.cn/bmiddle/6200b7a8t8b6743480673&690" /></div><div> 平滑回到顶部：<a href="#top">回到顶部链接</a></div>
JS部分$(".smooth").click(function(){ var href = $(this).attr("href"); var pos = $(href).offset().top; $("html,body").animate({scrollTop: pos}, 1000); return false;});
四、IE下锚点刷新失效及jQuery下的解决1、关于锚点刷新失效
所谓“锚点刷新失效”指的是当我们再次刷新页面(F5)的时候，即使此时的URL后面就随锚点，此锚点也是不起作用的。
还是拿最开始的例子演示，，我们在浏览器地址栏中输入或是复制如下URL：#0，或是点击这里。我们第一次进入这个页面的时候，锚点是正常的，页面定位到渐变背景的顶端。ok，现在，我们把页面滚动到顶部，如下图所示：
此时，我们再按下浏览器刷新按钮（或是F5），可以看到在IE浏览器下，页面依旧顶部显示，也就是说页面的锚点(#0)不再起作用了。大多数情况下，可能对我们的影响不是很大，但是有时候，例如我们在论坛里发布了一个帖子，发帖页面和帖子列表页面是同一页面，帖子提交后，我们想把页面定位到刚发的帖子处，在IE浏览器下就无法通过修改URL加锚点的方式实现。
如果让IE浏览器即使是同一URL刷新也能实现锚点定位呢？在jQuery下，不难实现。我们可以根据URL获取锚点，从而进一步获得对应的锚点对象，然后再让页面的滚动高度为其距离页面顶部的偏移值就可以了。文字叙述再精彩也不及实例来的直观，例如我们要处理一个链接地址为：#0的页面，要让其无论是重新载入还是当前页面刷新，其后面的锚点地址”#0″都要起作用。
其js代码如下，（与页面内容无关）
$(function(){ var url = window.location.toString(); var id = url.split("#")[1]; if(id){ var t = $("#"+id).offset().top; $(window).scrollTop(t); }});
您可以狠狠地点击这里：IE浏览器下刷新锚点失效修复demo
五、jQuery任意标签锚点跳转插件
上面所有提到锚点跳转的发起要不是页面的载入，要不就是a标签通过链接发起。其实我们可以点击任意标签实现锚点的跳转的。所以，我就特别写了个简单的jQuery插件，以实现任意标签页面任意位置的锚点跳转（可平滑）。
demo及下载
您可以狠狠地点击这里：任意标签锚点跳转demo
您可以狠狠地点击这里：jquery.anchor.1.0.js 1015字节 [右键-目标|链接另存为]
点击demo的文字链接或是按钮，均有跳转效果。
参数
参数默认解释ieFreshFixtrue布尔型，默认修复IE下刷新锚点不起作用的问题anchorSmoothtrue布尔型，默认平滑跳转anchortaganchor字符串，用以绑定id的标签属性，默认是"anchor"，属于自定义属性animateTime1000整数，动画执行的时间，如果anchorSmooth为false，则此参数无效插件使用
此插件的方法为：zxxAnchor()。
插件插件要想使用，需要对触发锚点跳转的标签进行一些设置。在默认情况下，要给标签添加一个自定义的属性anchor,例如：
<button type="button" anchor="top">点击我吧</button>