Minimalist jQuery Full Page Slider Plugin - Slidy

Slidy is a simplest jQuery presentation plugin which makes smooth slide animations between fullpage content sections in your web application.

How to use it:

1. Load jQuery library and the jQuery slidy plugin in your project.

<script src="//code.jquery.com/jquery-1.11.2.min.js"></script>
<script src="slidy.js"></script>

2. Create content sections containing next/prev links which allow you to navigate through the page smoothly.

<div class="page-slider" id="introduction">
  <a href="#presentation" class="nextPage">
    <span class="ion-arrow-down-b"></span>
  </a>
</div>

<div class="page-slider" id="presentation">
  <a href="#introduction" class="previousPage">
    <span class="ion-arrow-up-b"></span>
  </a>
</div>

3. Make the content sections fullpage in your CSS.

.page-slider {
  position: absolute;
  top: 0px;
  right: 0px;
  left: 0px;
  height: 100%;
}

.page-slider .nextPage,
.page-slider .previousPage {
  font-size: 60px;
  display: block;
}

4. Delete Vertical Bar in Navigator.

body { overflow-y: hidden; }

5. Enable the full page slider.

// Generate full page for .page-slider
Slidy.pageSlider();

// Generate slow scrolling (slide-effect)
Slidy.slowScrolling('slow');

---

This awesome jQuery plugin is developed by potheo. For more Advanced Usages, please check the demo page or visit the official website.