Se ha puesto muy de moda las páginas que scrollean a lo largo de una gran y única página principal, pero a menudo nos encontramos con que el scroll no lo hace moviendo sino saltando. Pues bien os presento el plugin para hacer smooth. Lo único que debemos hacer diferente a un anchor es que en vez de asignar a un “a” un name=”loquesea” debemos añadir un id id=”loquesea” y el link tiene que llamar a #loquesea. ¡Fácil! ¿no?

 
// JavaScript Document
 
$(document).ready(function() {
     function filterPath(string) {
          return string
          .replace(/^\//,'')
          .replace(/(index|default).[a-zA-Z]{3,4}$/,'')
          .replace(/\/$/,'');
     }
     var locationPath = filterPath(location.pathname);
     var scrollElem = scrollableElement('html', 'body');
 
     $('a[href*=#]').each(function() {
          var thisPath = filterPath(this.pathname) || locationPath;
          if (  locationPath == thisPath && (location.hostname == this.hostname || !this.hostname) && this.hash.replace(/#/,'') ) {
          var $target = $(this.hash), target = this.hash;
          if (target) {
               var targetOffset = $target.offset().top;
               $(this).click(function(event) {
                    event.preventDefault();
                    $(scrollElem).animate({scrollTop: targetOffset}, 500, function() {
                         location.hash = target;
                    });
               });
          }
     }
});
 
     // usa el primer elemento que es "scrolleable"
     function scrollableElement(els) {
          for (var i = 0, argLength = arguments.length; i <argLength; i++) {
               var el = arguments[i],
               $scrollElement = $(el);
               if ($scrollElement.scrollTop() > 0) {
                    return el;
               } else {
                    $scrollElement.scrollTop(1);
                    var isScrollable = $scrollElement.scrollTop() > 0;
                    $scrollElement.scrollTop(0);
                    if (isScrollable) {
                         return el;
                    }
               }
          }
          return [];
     }
});