f Cómo hacer Scroll Suave (Smooth Scrolling) - El Maquetador Web, Maquetación Freelance, Curso HTML HTML5 CSS Tutorial Diseño Responsive Adaptable

¿Necesitas Maquetar o Diseñar una web? ... Consulta nuestra sección Maquetación Freelance o solicita presupuesto a elmaquetadorweb@gmail.com

20.3.15

Cómo hacer Scroll Suave (Smooth Scrolling)

Para añadir un efecto de scroll suave a la hora de navegar dentro de la misma página a través de anclas (<a href="#nombredelancla">) vamos a usar el método .animate de jQuery. 

A continuación, la función de jQuery:

$(document).ready(function() {
  $("button").click(function() {
    $("html, body").animate({scrollTop: $("#destino").offset().top}, 2000);});
});

Podemos ver un ejemplo en nuestro codepen:
See the Pen JoeKdv by Pedro Marín (@pedromarin) on CodePen.

1 comentario:

  1. Funciona!!

    Muchas gracias de verdad. Lo había buscado bastante pero sin resultados hasta ahora.

    A favoritos tu web, está muy buena!!!

    ResponderEliminar