jquery - 为什么在滚动之前平滑滚动会闪烁？

我正在建立一个单页面网站，该网站通过定位标记分为多个部分。当您单击导航链接时，它会平滑滚动到该部分(仅完成了资金方面以及关于我们的信息)，但是，当您单击该链接时，似乎大约有50％的时间，它的平滑背景图像滚动到了闪烁jQuery上下滚动。

在我看来，HTML似乎试图立即转到 anchor ，因此闪烁了，但是jQuery说，按住，我需要缓慢滚动。

我不确定该如何解决。

jQuery的:

// SlowScroll Funding Areas
$(document).ready(function(){

// 'slowScrollTop' is the amount of pixels #teamslowScroll
// is from the top of the document

    var slowScrollFunding = $('#funding-areas').offset().top;

// When #anchor-aboutus is clicked

    $('#anchor-funding-areas').click(function(){
        // Scroll down to 'slowScrollTop'
        $('html, body, #home-wrap').animate({scrollTop:slowScrollFunding}, 1000);
    });
});

// SlowScroll About Us
$(document).ready(function(){
// 'slowScrollTop' is the amount of pixels #slowScrollTop
// is from the top of the document

    var slowScrollTop = $('#about-us').offset().top + 446;

// When #anchor-aboutus is clicked

$('#anchor-aboutus').click(function(){
    // Scroll down to 'slowScrollTop'
    $('html, body, #aboutus-wrap').animate({scrollTop:slowScrollTop}, 1000);
});
});

我非常感谢所有建议。

最佳答案

尝试在点击功能之后添加event.preventDefault();。

这将阻止链接执行应做的事情(立即跳转到 anchor )，并防止出现竞争情况。