JQuery滾動動畫瞬間閃爍主屏幕

Question

我使用bootstrap編寫了一個菜單，使用JQuery滾動到我的頁面的不同部分，但在滾動主屏幕之前一秒鐘閃爍。我不知道爲什麼會發生，或者如何阻止它。

$("#butHome").click(function() { 
$(".nav li").removeClass("active"); 
$(this).addClass("active"); 
$('html, body').animate({ 
    scrollTop: $("#home").offset().top 
}, 300); 
}); 
$("#but1").click(function() { 
$(".nav li").removeClass("active"); 
    $(this).addClass("active"); 
$('html, body').animate({ 
    scrollTop: $("#section1").offset().top 
}, 300); 
}); 
$("#but2").click(function() { 
$(".nav li").removeClass("active"); 
    $(this).addClass("active"); 
$('html, body').animate({ 
    scrollTop: $("#section2").offset().top 
}, 300); 
}); 
$("#but3").click(function() { 
$(".nav li").removeClass("active"); 
    $(this).addClass("active"); 
$('html, body').animate({ 
    scrollTop: $("#section3").offset().top 
}, 300); 
}); 
$("#but4").click(function() { 
$(".nav li").removeClass("active"); 
    $(this).addClass("active"); 
$('html, body').animate({ 
    scrollTop: $("#section4").offset().top 
}, 300); 
}); 

Answer 1

可能是因爲錨鏈接使得頁面在動畫開始之前滾動到頁面頂部。您可能會阻止此默認瀏覽器的行爲通過添加處理程序中執行以下操作：

$('.upp').click(function(e){ 
    e.preventDefault(); 
    $.scrollTo('#up', 800); 
}); 

COPIED