ROMANOVIAN

jQuery minislider is a very simple and very tiny slider that requires a minimum setup (2 CSS rules). I wrote this yet-another-jquery-slider because I really needed a simple slider that did just what I need, without rocket science features, indeed, jQuery minislider can be used as base to a more featured slider, if you can code it. Its weight is only 1948 bytes, less than 2Kb!

The basic features are:

• Control arrows (to move back and forward)
• Monitor (to know the current index)
• Slideshow
• Infinite loop

the advanced ones are:

• Easing (it requires the jQuery easing plugin) 

How to use it

Include jQuery and jQuery minislider in your page:

<script src="jquery-1.4.2.js" type="text/javascript"></script>
<script src="jquery.minislider.js" type="text/javascript"></script>

decide and write in your CSS the size of the slider:

.minislider {
    width:300px;
    height:300px;
}

and then put your sliding items in an HTML element:

<div class="minislider">
  <img src="1.jpg" /> 
  <img src="2.jpg" /> 
  <img src="3.jpg" /> 
  <img src="4.jpg" />
</div>

if you want to use control arrows and monitor add them:

<a class="prev" href="#">←</a>
<div class="monitor"></div>
<p><a class="next" href="#">→</a>

and finally you can call minislider:

$(function () {
	$(".minislider").minislider()
});

Options

Demo

You can see a demo here.

Download

If you like it, grab it here.

License

Beerware