Killer Carousel Example: API

The Killer Carousel API allows you to control the carousel by calling various API functions.

This will allow you to tailor the behaviour of Killer Carousel to suit different projects.

Choose the API function below the carousel to see an example of how it can be used.

Salvator Mundi 1519
St. John the Baptist 1516
Lady with an Ermine 1490
St. Jerome in the Wilderness 1480
Head of a Woman 1508
St. John the Baptist 1516
The Virgin and Child with St Anne and St John the Baptist 1500
Madonna of the Yarnwinder 1507
The Virgin and Child with St. Anne 1508
Madonna of the Carnation 1480
La belle ferronnière 1496
Adoration of the Magi 1481
Portrait of a Musician 1490
Virgin of the Rocks 1486
Madonna of Laroque 1503
Benois Madonna 1478
Mona Lisa 1517
Portrait of a man in red chalk 1512
Ginevra de' Benci 1478
The Last Supper 1498
Annunciation 1475
The Battle of Anghiari 1505

animateToRelativeItem(amount)

amount (type = NUMBER. Amount of items to move by.)

Moves backwards or forwards by the desired amount of items. Negative amounds move backwards.

bringToFront(itemIndex)

itemIndex (type = NUMBER. Index of the item to move to the front (zero = first item).)

Brings a specific item to the front of the carousel.

getFrontItemIndex()

Returns the index number of the item at the front.

getItemElement(itemIndex)

itemIndex (type = NUMBER. Index number of the item.)

Returns jQuery element of a carousel item.

destroy()

Destroys the carousel.

createItem(itemDefinition)

itemDefinition (type = STRING | JQUERY. jQuery object or HTML string the defines the carousel item.)

Creates a carousel item from a jQuery object or HTML string. Returns a carousel item ready for appending to the carousel.

appendItem(item)

item (type = KILLERCAROUSELITEM. Object created by createItem().)

Appends an item to the end of the carousel. Item created using createItem().

createNavButtons()

Creates the navigations buttons, usually after creating a carousel dynamically via ajax.

refreshSize()

Forces carousel to resize. Normally resizes automatically after window resize event.


Example

The following number is updated at 0.1 second intervals with the index of the front item.

An example of createItem() can be found here.

An example of appendItem() can be found here.

Clicking the button below will add text on a blue background to the top of alternate carousel items. Clicking again will remove the text.

Call refreshSize() if the wrapping carousel element size is changed independently of a window resize event.

Clicking the button below will destroy the carousel.


info

©2015 Star Plugins