Плавная прокрутка до блока по клику
Как по нажатию кнопки плавно прокрутить страницу к нужному блоку: якорная ссылка с CSS, scrollIntoView и вариант на jQuery.
Классический приём для лендингов: кнопка «Оставить заявку» в первом экране плавно прокручивает страницу к форме.
Без JavaScript
<a href="#request" class="button">Оставить заявку</a>
…
<section id="request">…</section>
html { scroll-behavior: smooth; }
#request { scroll-margin-top: 80px; } /* отступ под закреплённую шапку */
scroll-margin-top решает частую проблему: блок не уезжает под закреплённое меню.
JavaScript: scrollIntoView
document.querySelector('#button-scroll').addEventListener('click', function () {
document.querySelector('#scroll_to_id').scrollIntoView({ behavior: 'smooth', block: 'start' });
});
jQuery с настраиваемой длительностью
$('#button-scroll').on('click', function () {
const top = $('#scroll_to_id').offset().top;
$('html, body').animate({ scrollTop: top }, 800);
});
Длительность задаётся в миллисекундах. Больше секунды делать не стоит — посетитель начинает ждать.