Sudo Slider jQuery Plugin - TouchHandle demo

Drag this text! 1

Drag this text! 2

Drag this text! 3

Drag this text! 4

Drag this text! 5

Usage

Include the javascripts

<script type="Text/Javascript" src="http://code.jquery.com/jquery-1.11.2.min.js"></script>
<script type="text/javascript" src="../js/jquery.sudoSlider.min.js"></script>

The Javascript to start it.

<script type="text/javascript" >
   $(document).ready(function(){
      var sudoSlider = $("#slider").sudoSlider({
         continuous: true,
         touch: true,
         mouseTouch: true,
         touchHandle: "#slider h1",
         prevNext: true,
         numeric: true,
         effect: "fade"
      });
   });
</script>

The HTML

<div style="position:relative;">
   <div id="slider" class="slider">
      <div>
         <h1 style="text-align: center">Drag me! 1</h1>
         <img src="../images/01.jpg" alt="image description">
      </div>
      <div>
         <h1 style="text-align: center">Drag me! 2</h1>
         <img src="../images/02.jpg" alt="image description">
      </div>
      <div>
         <h1 style="text-align: center">Drag me! 3</h1>
         <img src="../images/03.jpg" alt="image description">
      </div>
      <div>
         <h1 style="text-align: center">Drag me! 4</h1>
         <img src="../images/04.jpg" alt="image description">
      </div>
      <div>
         <h1 style="text-align: center">Drag me! 5</h1>
         <img src="../images/05.jpg" alt="image description">
      </div>
   </div>
</div>