Плавная прокрутка к якорю без jQuery
1,00
р.
Есть отличный скрипт плавной прокрутки на jQuery.
var $page = $('html, body') $('a[href*="#"]').click(function() { $page.animate({ scrollTop: $($.attr(this, 'href')).offset().top }, 400) return false })
Как можно отобразить на чистом JS?
Ответ
Есть еще стандартный способ плавной прокрутки Element.scrollIntoView().
const anchors = document.querySelectorAll('a[href*="#"]') for (let anchor of anchors) { anchor.addEventListener('click', function (e) { e.preventDefault() const blockID = anchor.getAttribute('href').substr(1) document.getElementById(blockID).scrollIntoView({ behavior: 'smooth', block: 'start' }) }) } h2 { margin-bottom: 100vh }
var $page = $('html, body') $('a[href*="#"]').click(function() { $page.animate({ scrollTop: $($.attr(this, 'href')).offset().top }, 400) return false })
Как можно отобразить на чистом JS?
Ответ
Есть еще стандартный способ плавной прокрутки Element.scrollIntoView().
const anchors = document.querySelectorAll('a[href*="#"]') for (let anchor of anchors) { anchor.addEventListener('click', function (e) { e.preventDefault() const blockID = anchor.getAttribute('href').substr(1) document.getElementById(blockID).scrollIntoView({ behavior: 'smooth', block: 'start' }) }) } h2 { margin-bottom: 100vh }
