Minimalist jQuery Full Page Slider Plugin - Slidy

Minimalist jQuery Full Page Slider Plugin - Slidy
File Size: 2.74 MB
Views Total: 755
Last Update:
Publish Date:
Official Website: Go to website
License: MIT

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="//"></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>

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

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

// Generate slow scrolling (slide-effect)

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