back to top button javascript smooth scrolling code example

Example 1: javascript go to top of page

window.scroll({
 top: 0, 
 left: 0, 
 behavior: 'smooth' 
});

Example 2: smooth scroll css

html {
  scroll-behavior: smooth;
}

/* No support in IE, or Safari
You can use this JS polyfill for those */
http://iamdustan.com/smoothscroll/

Example 3: simple button scrolling with this

// Select all »a« elements with a parent tag »nav« and add a function that is executed on click
$('#id a').on('click', function (e) {

   // Define variable of the clicked »a« element (»this«) and get its href value.
   var href = $(this).attr('href')

   // Run a scroll animation to the position of the element which has the same id like the href value.
   $('html, body').animate({
      scrollTop: $(href).offset().top
   }, '300')

   // Prevent the browser from showing the attribute name of the clicked link in the address bar
   e.preventDefault()

})

Tags:

Html Example