jQuery CSS Slider Demos

by David Wallin

Next
Previous

5 across example

Next
Previous

Events:

CSS Classes Needed: (see animated-slider.css)

  • previous_hidden
  • next_hidden
  • previous_item
  • next_item
  • previous_item_2 * Only used with 5 across
  • next_item2 * Only used with 5 across
  • current_item

Also, the LI needs to have css transitions set up.

You can get access to the AnimatedSlider object by:

var slider = $("myULList").data("AnimatedSlider");

Methods

slider.setItem(n);

Jump to the specified index

slider.prevItem();

Go to the previous item

slider.nextItem();

Go to the next item

slider.refresh();

Refresh the presentation (basically just sets the classes again) in case something changed.

Variables

  • numSliderItems - the number of items in the slider
  • currentItem - the current index

License

Available under the MIT license.