Question

I’m working on a one page website and would like to include named anchors across it for each section.

I also would like it so when you click a hyperlink on the navigation, it scrolls down/up the page smoothly rather than a quick jump.

What is the simplest copy and paste type jQuery script that I could use?

Thanks

Answer 1

this is a quick little script that should do the trick:

replace a with the selector of your links in the navigation. I’ve found scrolling body, html makes the scrolling a lot smoother

$('.nav_item').click(function(e){
    e.preventDefault(); //used to prevent default actions
    var _this = $($(this).attr('href'));
    $('body, html').animate({
        scrollTop: _this.offset().top
    }, 400) // how ever fast you want it to scroll.

});