Basic Responsive jQuery Slideshow/Carousel Plugin - Slideshow
File Size: | 111 KB |
---|---|
Views Total: | 847 |
Last Update: | |
Publish Date: | |
Official Website: | Go to website |
License: | MIT |
A basic jQuery slideshow/carousel plugin which allows you to cycle through a set of images with support for auto-rotation and custom controls.
Dependencies:
- jQuery
- Tweenmax JS library for animating DOM elements.
- jQuery knob plugin for circular controls.
How to use it:
1. Include the jQuery, Tweenmax JS library and jQuery knob plugin in the document.
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> <script type="text/javascript" src="lib/TweenMax.min.js"></script> <script type="text/javascript" src="lib/jquery.knob.min.js"></script>
2. Include the jQuery Slideshow plugin after jQuery library.
<script src="jquery-slideshow.js"></script>
3. Insert your images into container elements as follows.
<div id="slider"> <div class="slider"> <div> <img width="" height="" src="1.jpg" alt="Slide 1"> </div> <div> <img width="" height="" src="2.jpg" alt="Slide 2"> </div> <div> <img width="" height="" src="3.jpg" alt="Slide 3"> </div> </div> </div>
4. Call the plugin on the parent element and we're done.
$('#slider').slideshow();
Change log:
2014-09-18
- Update jquery-slideshow.js
This awesome jQuery plugin is developed by nuovodesign. For more Advanced Usages, please check the demo page or visit the official website.