如何为平滑滚动添加缓动？

Question

I have this script where I'd like to add some easing to make the whole scrolling effect a little smoother:

$('a[href*="#"]')
  .not('[href="#"]')
  .not('[href="#0"]')
  .click(function(event) {
    if (
      location.pathname.replace(/^\//, '') == this.pathname.replace(/^\//, '') 
      && 
      location.hostname == this.hostname
    ) {
      var target = $(this.hash);
      target = target.length ? target : $('[name=' + this.hash.slice(1) + ']');
      if (target.length) {
        event.preventDefault();
        $('html, body').animate({
          scrollTop: target.offset().top}, 1000,
          function() {
          var $target = $(target);
          $target.focus();
          if ($target.is(":focus")) {
            return false;
          } else {
            $target.attr('tabindex','-1');
            $target.focus(); // Set focus again
          };
        });
      }
    }
  });

So I picked this line and added 'easeOutExpo' , but unfortunately it didn't work. Any idea what I'm doing wrong?

scrollTop: target.offset().top}, 1000, 'easeOutExpo',

https://jsfiddle.net/3gb4s2af/1/

Answer 1

Please include the line mentioned below after jQuery script. this worked for me.

<script src='http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.5/jquery-ui.min.js'>

OR: Download custom jQueryUi from here