Deslizador de página horizontal con JavaScript puro-lateralmente

Vista prévia

Descripción

Lateralmente. js es un plugin Vanilla de JavaScript para la aplicación de una sola página o Página de presentación que permite al usuario deslizarse a través de un grupo de página de pantalla completa diapositivas con controles de navegación personalizados.

Funcionamiento

Inserte el archivo JavaScript principal en la Página Web.

<script src="index.js"></script>

Agregue diapositivas a la página web siguiendo el marcado HTML como este.

<div class="sideways">

<div class="pages">


<section class="page page-1">



<div class="page-right">Navigation(Right)</div>


</section>


<section class="page page-2">



<div class="page-left">Navigation(left)</div>



<div class="page-right">Navigation(Right)</div>


</section>

 ...


<section class="page page-last">



<div class="page-left">Navigation(left)</div>


</section>

</div>
</div>

Inicializa los lados y especifica la diapositiva inicial.

sideways.init(1)

API methods.

// Gets the current page
sideways.getCurrentPage()

// Returns an array of pages
sideways.getPages()

// Slides to a specified page
sideways.moveTo(pageNumber)

// Slides to the previous page
sideways.moveLeft()

// Slides to the next page
sideways.moveRight()

// Slides to a specified page (to left)
sideways.movePageToLeft(pageNumber)

// Slides to a specified page (to right)
sideways.movePageToRight(pageNumber)

// A promise-based implementation of setTimeout useful for async functions.
sideways.delay(ms)