Kaydırmadan önce neden yumuşak kaydırma yanıp sönüyor?

Question

Çapa etiketleri ile bölümlere ayrılan tek bir sayfa web sitesi yapıyorum. Nav linklerini tıkladığınızda pürüzsüz bölümlere kaydırır (sadece fonlama alanları ve bizim için tamamlanır), ancak bağlantıyı tıklattığınız zamanın% 50'si gibi görünür, pürüzsüz arka plan görüntüsü önce yanıp söner. jQuery yukarı veya aşağı kaydırır.

Bana göre HTML hemen ankraja gitmeye çalışıyor, dolayısıyla yanıp sönüyor, ama jQuery diyor ki, yavaşça kaydırmam gerekiyor.

Bunu nasıl çözeceğimi bilmiyorum.

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); 
}); 
}); 

ben çok takdir her türlü öneri.

Answer 1

Tıklatma işlevinizden sonra event.preventDefault(); eklemeye çalışın.

Bu, bağlantının ne yapması gerektiği ile uğraşmasını engeller (hemen bağlantıya atlar) ve bir yarış koşulunu önler.

Answer 2

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

Hatta daha temiz: neden

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

aşağıda açıklanmıştır:

• event.preventDefault() vs. return false