Responsive Vertical/Horizontal Carousel Plugin - jQuery RSwiper

File Size: 5.32 KB
Views Total: 9196
Last Update:
Publish Date:
Official Website: Go to website
License: MIT
   
Responsive Vertical/Horizontal Carousel Plugin - jQuery RSwiper

RSwiper is a responsive, cross-browser and cross-platform jQuery carousel slider plugin which features auto-rotation, navigation controls and vertical or horizontal scrolling.

How to use it:

1. Create a list of slide items and insert them into a slider container element as follows:

<div id="demo">
  <ul>
    <li><h1>this is page 1</h1></li>
    <li><h1>this is page 2</h1></li>
    <li><h1>this is page 3</h1></li>
    <li>Supports any html contents</li>
    ...
  </ul>
</div>

2. Load the main JavaScript file RSwiper.js after jQuery library.

<script src="//code.jquery.com/jquery-3.2.1.min.js"></script>
<script src="RSwiper.js"></script>

3. Call the function on the slider container and you're done.

$('#demo').RSwiper();

4. Enable the vertical scrolling functionality.

$('#demo').RSwiper({
  direction:'vertical'
});

5. Set the transition delay in milliseconds.

$('#demo').RSwiper({
  speed:3000
});

6. Enable/disable the slider controls.

$('#demo').RSwiper({
  isPagination:true,
  isArrows:true
});

7. Execute a function on each slide.

$('#demo').RSwiper({
  tickfunc: function(){
    // do something...
  }
});

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