En muchas páginas es común tener enlaces que nos llevan a distintas partes dentro de ésta, como por ejemplo hacer clic en el enlace de un índice para llevarlos a la posición de la página en donde comienza la sección o estar en la parte inferior y encontrar un enlace que nos desplaza (lleva) hacia arriba. Con Smooth Anchors podemos hacer esto mismo pero con un desplazamiento suave del texto y de una forma cómoda, sencilla y estéticamente agradable.
Lo primero que haremos será incluir las librerías JavaScript necesarias para ello; jQuery y Smooth Anchors.
… …El siguiente paso será inicializar el plugin añadiendo a la cabecera de nuestro código fuente las siguientes líneas:
… $(document).ready(function() { // $.smoothAnchors(velocidad [, tipoDeEfecto [, redirección]]) // -> velocidad = “slow” | “normal” | “fast” // -> tipoDeEfecto = “linear” | “swing” // -> redirección = true | false $.smoothAnchors(“normal”, “swing”, false); }); …Mediante el código anterior estamos indicando que cualquier tipo de enlace que nos dirija a una sección de la misma página deberá realizar el scrolling utilizando el plugin Smooth Anchors. Además, la velocidad la inicializaremos a normal.
Finalmente, el último paso será, evidentemente, crear los enlaces pertinentes dentro de nuestra página web. Por ejemplo, de la siguiente forma:
… Sección 01 Sección 02 … Sección 01Texto de la primera sección
Texto de la segunda sección
…
Etiquetas: dentro, jQuery, misma, pgina, TransicionesDesplazamientos
