Question

我使用以下代码进行自动滚动锚定

        setTimeout(function(){window.location.hash = "#anchor";},5000);

它工作正常，但我需要在滚动时添加平滑效果。

JSFIDDLE

Answer 1

使用jQuery的常见解决方案是将scrollTop属性设置为目标元素的偏移y位置的动画：

$('html,body').animate({
    scrollTop: $('#anchor').offset().top
});

演示：http://jsfiddle.net/HZejZ/1/

如果您希望保持代码原样（未经测试），您可以收听hashchange事件：

$(window).on('hashchange', function(e) {
    e.preventDefault();
    var $target = $(window.location.hash);
    if ( $target.length ) {
        $('html,body').animate({scrollTop: $target.offset().top});
    }
});

（编辑：这似乎有问题，即使调用了preventDefault，浏览器也会跳转）

Answer 2

使用以下代码

  $('html, #anchor').animate({ scrollTop: 0 },'slow');

这是100％的工作代码。如果它也适合你，请将其标记为答案，以便其他人也可以使用它......

自动滚动到锚点时的平滑效果

2 个答案: