Author: | IsaacAbrahamson |
---|---|
Views Total: | 3,590 views |
Official Page: | Go to website |
Last Update: | November 5, 2018 |
License: | MIT |
Preview:

Description:
Sideways.js is a vanilla JavaScript slider plugin for single page app or presentation page that enables the user to slide through a group of fullscreen page slides with custom navigation controls.
How to use it:
Insert the main JavaScript file into the webpage.
<script src="index.js"></script>
Add slides to the webpage following the HTML markup like this.
<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>
Initialize the Sideways and specify the initial slide.
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)