简单几句jquery实现锚点平滑滚动
如下js函数可以实现点击a标签之后页面在锚点之间平滑的滚动:
$('a').click(function(){
$('html, body').animate({
scrollTop: $( $.attr(this, 'href') ).offset().top
}, 500);
return false;
});
如果有性能的要求,您可以将 $('html, body').缓存到一个变量中,这样就没有必要每次执行之前都去找根节点了。
var $root = $('html, body');
$('a').click(function() {
$root.animate({
scrollTop: $( $.attr(this, 'href') ).offset().top
}, 500);
return false;
});
如果需要在anchor滑动结束之后,改变浏览器地址栏上的锚点,可以使用下面的函数:
var $root = $('html, body');
$('a').click(function() {
var href = $.attr(this, 'href');
$root.animate({
scrollTop: $(href).offset().top
}, 500, function () {
window.location.hash = href;
});
return false;
});