Swipe 2

Demo

Prev Next

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');