Плавный прокрутка к div не работает?

Question

Я работаю над липкой навигацией, где пользователь нажимает на ссылку навигации, чтобы перейти к этой конкретной секции.

JQuery для сценария:

$('navbar-brand, .action-button, .navHeaderCollapse a[href^="#"]').on('click', function(event) { 
    var target = $(this.href); 
    if(target.length) { 
     event.preventDefault(); 
     $('html, body').animate({ 
     scrollTop: target.offset().top 
     }, 2000); 
    } 
}); 

При нажатии на ссылку действительно принимает его в этот раздел, но это немедленно, т.е. без каких-либо задержек или не гладко.

Answer 1

Попробуйте ввести следующий код, this.href даст вам полный URL. поэтому постарайтесь, чтобы получить атрибут дэ вместо этого

$('navbar-brand, .action-button, .navHeaderCollapse a[href^="#"]').on('click', function (event) { 
    var target = $($(this).attr("href")); <-- this line will do the trick 
    if (target.length) { 
     event.preventDefault(); 
     $('html, body').animate({ 
      scrollTop: target.offset().top 
     }, 2000); 
    } 
}); 

Demo

Answer 2

См http://jsfiddle.net/uehcpcg5/

Вы имели опечатку с

var target = $(this.href); 

должен быть

var target = $(this).href 

, который в любом случае возвращает undefined.

Изменено что

$(this).prop("href"); 

который возвращает полный URL, поэтому разделить его с #, чтобы получить идентификатор целевого DIV, затем прокручивается к этому. SO выглядит так, что ваше событие не обрабатывало href правильно.