Minimal jQuery Content Carousel Slide Plugin - ListBox
| File Size: | 6.33 KB |
|---|---|
| Views Total: | 923 |
| Last Update: | |
| Publish Date: | |
| Official Website: | Go to website |
| License: | MIT |
ListBox is a tiny and easy-to-use jQuery plugin that transforms a list of html content into a vertical or horizontal carousel slider with next / prev navigation.
How to use it:
1. Load the style.css in the head section for basic carousel styles.
<link rel="stylesheet" href="style.css">
2. Add a list of html content into the carousel. The plugin's options can be passed via data-OptionName attributes set in the top element as follow.
<div class="listbox lightThem"
data-orientation="vertical"
data-step="512">
<ul>
<li><img src="1.png"></li>
<li><img src="2.png"></li>
<li><img src="3.png"></li>
</ul>
</div>
3. Load jQuery library and the jQuery ListBox plugin at the end of the document.
<script src="//code.jquery.com/jquery-1.11.3.min.js"></script> <script src="listbox.js"></script>
4. Initialize the plugin and done.
$('.listbox').ListBox();
5. Full plugin options.
orientation: 'horizontal', // value: horizontal | vertical prevButton: '#prev', nextButton: '#next', step: 0, duration: 500, easing: "swing" // "swing" or "linear"
This awesome jQuery plugin is developed by vlada-j. For more Advanced Usages, please check the demo page or visit the official website.










