Biblioteca de JavaScript para un sitio web de desplazamiento de una página-inscroll
| Autor: | andreymdias |
|---|---|
| Views Total: | 2,322 |
| Sitio oficial: | Ir a la web |
| Actualizado: | October 15, 2015 |
| Licencia: | MIT |
Vista prévia
Descripción
inscroll es una biblioteca de JavaScript independiente que se utiliza para crear un efecto de desplazamiento vertical suave para el sitio web de una página o aplicación de una sola página.
Funcionamiento
Agregue un conjunto de secciones de contenido a su página web. Tenga en cuenta que cada sección debe tener un atributo de página de datos único como sigue.
<section data-page="section1"> <h2>Section One</h2> </section> <section data-page="section2"> <h2>Section Two</h2> </section> <section data-page="section3"> <h2>Section Three</h2> </section>
Cargue el scrollIt. min. CSS, polyfill. min. js y scrollIt. min. js en la Página Web.
<link href="dist/scrollIt.min.css" rel="stylesheet"> <script src="dist/polyfill.min.js"></script> <script src="dist/scrollIt.min.js"></script>
Active el efecto de desplazamiento de una página.
var scrollIt = new ScrollIt();
Opciones posibles.
var scrollIt = new ScrollIt({
// displays side navigation
nav: true,
// transition time
time: 200,
// transition delay
delay: 150,
// base element
elem: document.body
}); Api.
// go to next section
document.querySelector('buttom#next').addEventListener(function(){
scrollIt.next();
});
// back to previous section
document.querySelector('buttom#previous').addEventListener(function(){
scrollIt.previous();
});
// scroll to section 2
document.querySelector('buttom#to2').addEventListener(function(){
scrollIt.scroll(1);
});





