Minimal Automatic Image Slider Plugin With jQuery - jImgSlider
| File Size: | 15.4 KB | 
|---|---|
| Views Total: | 1226 | 
| Last Update: | |
| Publish Date: | |
| Official Website: | Go to website | 
| License: | MIT | 
 
jImgSlider is a simple, fast, automatic, cross-browser image slider/carousel plugin that has the ability to resize and center the inner images depending on the size of their parent container.
How to use it:
1. Download and include the jQuery jImgSlider's stylesheet in the head section of the html page.
<link rel="stylesheet" href="css/jImgSlider.css">
2. Add a group of images wrapped in DIV elements into the slider.
<div id="demo">
  <div>
    <div><img src="1.jpg"></div>
    <div><img src="2.jpg"></div>
    <div><img src="3.jpg"></div>
    <div><img src="4.jpg"></div>
    <div><img src="5.jpg"></div>
  </div>
</div>
3. Include the jQuery jImgSlider's JavaScript after loading jQuery library when needed.
<script src="jquery.js"></script> <script src="js/jImgSlider.js"></script>
4. Initialize the image slider.
$("#demo").jImgSlider();
5. Make the image slider centered in the webpage.
#demo {
  background-color: #a5caa5;
  margin: 0 auto;
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
}
6. Specify the height/width of the image slider.
$("#demo").jImgSlider({
  'width':600,
  'height':450
});
This awesome jQuery plugin is developed by GeinFan. For more Advanced Usages, please check the demo page or visit the official website.










