jQuery Slider²

Simple

Tested with humen, no monkeys. Download
stable
Download
devel

Light

I think ~5,7k as raw is not too bad. Download
stable
Download
devel

Easy

$('#slider').slider(); Too hard? Download
stable
Download
devel

What is it?

It's now back.

A small and lightweight jQuery-plugin to create simple inline slideshow.

TODO/Changes

1.2.0 ?
What to do?
1.1.0 (22.8.2011)
Random starting slide now possible. It's also
possible to choose slide by clicking progress balls now.
1.0.0 (21.6.2011)
Rewrote the plugin. Much nicer now ;)
0.0.5 (?)
On hover shown controls
Link-support to slides
0.0.4 (15.3.2011)
Fixed problems with Firefox
Events: beforeSlide, afterSlide, onRewind
hoverPause-option to pause when user is hovering selector
0.0.3 (6.3.2011)
Fix next/prev -buttons' animation stacking.
Support for text content.
0.0.2 (4.3.2011)
Fixed problems with IE6-8.
Sliding direction (left/right) can be configured now.
Added scroll buttons.
0.0.1 (20.2.2011)
First release

License

MIT License

No requirements nor special terms.
Send me a hello and link to your project, if you feel like it. (Use this address, please.)

Documentation

Methods and options are documented below.
Slider uses selector's children as slides.
You build the slides with CSS & HTML and we do the rest. ;)

.slider( options )

Description: Initialize and start sliding the elements inside current selector.

Options


autoplay (boolean)
Default: true. Autoplay slides
showControls (boolean)
Show controls for previous & next
showProgress (boolean)
Show progress with funny dots
hoverPause (boolean)
Pause on hover
wait (integer)
Milliseconds to wait before next frame
fade (integer)
Milliseconds to fade
direction ([left|right])
Default: left. Images will slide to this direction
randomize (boolean)
Default: false. Randomizes starting slide.
rewind (function)
Callback on rewind
slidebefore (function)
Called before slide
slideafter (function)
Called after slide


Examples

<head> stuff
        <script type="text/javascript" src="js/jquery.slider.min.js"></script>
        <link href="css/jquery.slider.css" rel="stylesheet" type="text/css" />
                
Example with options
        $('#slider').slider({autoplay: false, randomize: true});
Basic example
        $('#slider').slider();