How to implement your own? plugin or script?

  • What do you mean by "smooth anchor"? What would the page smoothly scroll to the anchor? - Vasya Shmarovoz
  • @VasyaShmarovoz Yes, to smoothly scroll - Timofey

1 answer 1

You need something like this. JQuery example

$(function() { // Ищем сслки с якорями $('[href^="#"]').click(function(event) { // Блокируем станадртное поведение ссылки event.preventDefault(); // И устанавливаем хэш в адресной строке руками window.location.hash = anchor; // Берём id из якоря var anchor = $(this).attr('href'); // Если нет элемента с этим id, уходим if(!$(anchor).length) return; // Получаем координату нужного элемента var scrollPoint = $(anchor).offset().top; // Идём к этому элементу, со скоростью в 500 мс $(document.body).animate({scrollTop: scrollPoint}, 500); }); }); 
 /* Стили только для того, что бы увеличить страницу в примере */ #sample-wrap > a { display: block; margin-bottom: 2500px; } 
 <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> <div id="sample-wrap"> <a href="#anchor">Ссылка на якорь</a> <div id="anchor">Элемент с якорем</div> <a href="#sample-wrap">Вернуться наверх</a> </div>