Thanks to visit codestin.com
Credit goes to swipe.js.org

Fork me on GitHub

Swipe

Swipe is the most accurate touch slider. It is extremely lightweight (only 6kb minified) and works across all browsers, including IE8+.

Demo

0
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20

Usage

Swipe is written in vanilla javascript. You may either create a new instance of Swipe using plain javascript or initialize it via the provided jQuery/Zepto method (assuming the library is already loaded on the page).

Markup

<div id="slider" class="swipe">
  <div class="swipe-wrap">
    <div></div>
    <div></div>
    <div></div>
  </div>
</div>

Style

.swipe {
  overflow: hidden;
  visibility: hidden;
  position: relative;
}
.swipe-wrap {
  overflow: hidden;
  position: relative;
}
.swipe-wrap > div {
  float: left;
  width: 100%;
  position: relative;
}

Javascript

Vanilla Javascript

var element = document.getElementById('mySwipe');
window.mySwipe = new Swipe(element, {
  startSlide: 0,
  auto: 3000,
  draggable: false,
  autoRestart: false,
  continuous: true,
  disableScroll: true,
  stopPropagation: true,
  callback: function(index, element) {},
  transitionEnd: function(index, element) {}
});

Using jQuery or Zepto

window.mySwipe = $('#mySwipe').Swipe().data('Swipe');

License

This software is ©2015 Brad Birdsall and Felix Liu, released under the MIT License.