SummArg | Cursos y recursos para webmasters

28/10/2013

jQuery AnimateScroll, efectos easing para el scroll

AnimateScroll es un plugin para jQuery que nos permite utilizar animaciones easing para utilizar anclas en una misma página. Es simple de usar y posee algunos parámetros que nos permiten su personalización.

  • easing: Tipo de animación
  • scrollSpeed: Velocidad
  • padding: Margen hacia arriba y hacia abajo de rebotes de la animación
  • element: Elemento que activa la animación, por defecto es body.

Ejemplo de uso:

<html>
    <head>
        <script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
        <script src="animatescroll.js">
    </head>
    <body>
        <div id="section-1">This is the element where you want to scroll to<div>
        // You may call the function like this
        <a onclick="$('[id-or-class-of-element]').animatescroll();">Go to Element</a>
    </body>
</html>

scroll

Dejar un comentario