Answers for "how to create smooth scrolling anchor links"

7

javascript smooth scroll to anchor element

//add smooth scrolling when clicking any anchor link
document.querySelectorAll('a[href^="#"]').forEach(anchor => {
    anchor.addEventListener('click', function (e) {
        e.preventDefault();
        document.querySelector(this.getAttribute('href')).scrollIntoView({
            behavior: 'smooth'
        });
    });
});
//<a href="#someOtherElementID"> Go to Other Element Smoothly </a>
Posted by: Guest on August-02-2019
1

smooth scroll on anchor tag

document.querySelectorAll('a[href^="#"]').forEach(anchor => {
    anchor.addEventListener('click', function (e) {
        e.preventDefault();

        document.querySelector(this.getAttribute('href')).scrollIntoView({
            behavior: 'smooth'
        });
    });
});
Posted by: Guest on October-06-2021
0

smooth scrolling when clicking an anchor link

// smooth scrolling when clicking an anchor link 
$('.nav-item a').on('click', function () {
    if (location.pathname.replace(/^\//, '') === this.pathname.replace(/^\//, '') && location.hostname === this.hostname) {
        let target = $(this.hash);
        target = target.length ? target : $('[name=' + this.hash.slice(1) + ']');
        if (target.length) {
            html_body.animate({
                scrollTop: target.offset().top - 0
            }, 1500);
            return false;
        }

    }
});
Posted by: Guest on July-15-2021

Code answers related to "Javascript"

Browse Popular Code Answers by Language