Smooth Page Switch Plugin For Mobile Web Pages - slideit.js

slideit.js is a lightweight jQuery plugin that provides smooth, high performance, vertical page switch animations for your mobile website. Based on CSS3 transitions and transforms. Note that you should run the demo on the mobile or mobile simulator (e.g. Google Chrome dev tool).

How to use it:

1. Load the jQuery slideit.js plugin's CSS file in the header of your html document.

<link rel="stylesheet" href="jquery.slideit.css">

2. Split your webpage into several page sections like this:

<div id="slideit">
  <section class='red'></section>
  <section class='grey'></section>
  <section class='blue'></section>
  <section class='yellow'></section>
  <section class='green'></section>
</div>

3. Load jQuery library and the jQuery slideit.js plugin's CSS file at the bottom of the document.

<script src="//code.jquery.com/jquery-2.2.1.min.js"></script>
<script src='jquery.slideit.js'></script>

4. Call the function on the top container to initialize the plugin.

$('#slideit').slideit({
  // options here
});

5. Possible plugin options.

$('#slideit').slideit({
  range:100, // pixels
  time:500 // ms
});

---

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