jQuery Based Auto-fading Image Carousel Slider - jbslider

Just another jQuery plugin to create a fashion auto-fading image carousel slider with following features:

• Auto play slideshow.
• Pause auto-rotation on hover.
• Next/prev navigation and dot buttons.
• Bottom progress bar.
• Thumb views.
• Fully customizable via CSS and Javascript.
• Compatible with modern browsers and IE 7/8/9.

How to use it:

1. Include the jQuery jbslider.css in the head section of the document.

<link rel="stylesheet" href="css/jbslider.css">

2. Include the jQuery jbslider's script at the bottom of the document , but after jQuery library.

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script src="js/jbslider-min.js"></script>

3. Insert your images into a container element.

<div class="slider-holder" id="demo">
  <img src="image1.jpg">
  <img src="image2.jpg">
  <img src="image3.jpg">
  ...
</div>

4. Call the plugin to create an image slider with default settings.

$(document).ready(function() {		
  $("demo").jbSlider();
});

5. All the default settings.

$(document).ready(function() {		
  $("demo").jbSlider({
    animSpeed       : 1000,
    autoPlay        : true,
    autoHide        : true,
    autoHideDelay   : 1000,
    autoHideSpeed   : 500,
    controlButtons  : false,
    controlDots     : true,
    controlDotsPos  : "center-top",
    loader          : false,
    nextText        : "Next",
    pauseTime       : 6000,
    pauseOnHover    : true,
    pauseTextShow   : false,
    pauseText       : "Pause",
    prevText        : "Prev",
    thumbView       : false,
    thumbWidth      : 90});
});	

---

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