# Yahoo! UI Library

### Carousel Widget 2.6.0

Yahoo! UI Library > carousel > YAHOO.widget.Carousel

Show Private Show Protected Show Deprecated

## Class YAHOO.widget.Carousel - extends YAHOO.util.Element

The Carousel widget.

### Constructor

YAHOO.widget.Carousel `( el , cfg )`

Parameters:
  `el <HTMLElement | String>` The HTML element that represents the the container that houses the Carousel.
  `cfg <Object>` (optional) The configuration values

### Properties

#### _carouselEl `- private object`

The Carousel element.

#### _clipEl `- private object`

The Carousel clipping container element.

#### _firstItem `- private object`

The current first index of the Carousel.

#### _isAnimationInProgress `- private object`

Is the animation still in progress?

#### _itemsTable `- private object`

The table of items in the Carousel. The numItems is the number of items in the Carousel, items being the array of items in the Carousel. The size is the size of a single item in the Carousel. It is cached here for efficiency (to avoid computing the size multiple times).

#### _navBtns `- private object`

The Carousel navigation buttons.

#### _navEl `- private object`

The Carousel navigation.

#### _nextEnabled `- private object`

Status of the next navigation item.

#### _pages `- private object`

The Carousel pages structure. This is an object of the total number of pages and the current page.

#### _prevEnabled `- private object`

Status of the previous navigation item.

#### _recomputeSize `- private object`

Whether the Carousel size needs to be recomputed or not?

#### BUTTON `- object`

The class name of the Carousel navigation buttons.
Default Value: "yui-carousel-button"

#### CAROUSEL `- object`

The class name of the Carousel element.
Default Value: "yui-carousel"

#### CAROUSEL_EL `- object`

The class name of the container of the items in the Carousel.
Default Value: "yui-carousel-element"

#### CONTAINER `- object`

The class name of the Carousel's container element.
Default Value: "yui-carousel-container"

#### CONTENT `- object`

The class name of the Carousel's container element.
Default Value: "yui-carousel-content"

#### DISABLED `- object`

The class name of a disabled navigation button.
Default Value: "yui-carousel-button-disabled"

#### FIRST_NAV `- object`

The class name of the first Carousel navigation button.
Default Value: " yui-carousel-first-button"

#### FIRST_NAV_DISABLED `- object`

The class name of a first disabled navigation button.
Default Value: "yui-carousel-first-button-disabled"

#### FIRST_PAGE `- object`

The class name of a first page element.
Default Value: "yui-carousel-nav-first-page"

#### FIRST_VISIBLE `- object`

The offset of the first visible item in the Carousel.
Default Value: 0

#### FOCUSSED_BUTTON `- object`

The class name of the Carousel navigation button that has focus.
Default Value: "yui-carousel-button-focus"

#### HORIZONTAL `- object`

The class name of a horizontally oriented Carousel.
Default Value: "yui-carousel-horizontal"

#### instances `- private static object`

The internal table of Carousel instances.

#### ITEM_LOADING `- object`

The element to be used as the progress indicator when the item is still being loaded.
Default Value: The progress indicator (spinner) image

#### ITEM_TAG_NAME `- object`

The tag name of the Carousel item.
Default Value: "LI"

#### MAX_PAGER_BUTTONS `- object`

The maximum number of pager buttons allowed beyond which the UI of the pager would be a drop-down of pages instead of buttons.
Default Value: 5

#### MIN_WIDTH `- object`

The minimum width of the Carousel container to support the navigation buttons.
Default Value: 99

#### NAV_CONTAINER `- object`

The class name for the navigation container for prev/next.
Default Value: "yui-carousel-buttons"

#### NAVIGATION `- object`

The navigation element container class name.
Default Value: "yui-carousel-nav"

#### NEXT_BUTTON_TEXT `- object`

The next navigation button name/text.
Default Value: "Next Page"

#### NEXT_PAGE `- object`

The class name of the next navigation link. This variable is not only used for styling, but also for identifying the link within the Carousel container.
Default Value: "yui-carousel-next"

#### NUM_VISIBLE `- object`

The number of visible items in the Carousel.
Default Value: 3

#### PAGER_PREFIX_TEXT `- object`

The prefix text for the pager in case the UI is a drop-down.
Default Value: "Go to page "

#### PREV_PAGE `- object`

The class name of the previous navigation link. This variable is not only used for styling, but also for identifying the link within the Carousel container.
Default Value: "yui-carousel-prev"

#### PREVIOUS_BUTTON_TEXT `- object`

The previous navigation button name/text.
Default Value: "Previous Page"

#### SELECTED_ITEM `- object`

The class name of the selected item.
Default Value: "yui-carousel-item-selected"

#### SELECTED_NAV `- object`

The class name of the selected paging navigation.
Default Value: "yui-carousel-nav-page-selected"

#### TAG_NAME `- object`

The tag name of the Carousel.
Default Value: "OL"

#### VERTICAL `- object`

The class name of a vertically oriented Carousel.
Default Value: "yui-carousel-vertical"

#### VERTICAL_CONTAINER `- object`

The class name of the (vertical) Carousel's container element.
Default Value: "yui-carousel-vertical-container"

#### VISIBLE `- object`

The class name of a visible Carousel.
Default Value: "yui-carousel-visible"

#### WidgetName `- private static object`

The widget name.

#### Properties inherited from YAHOO.util.Element:

`DOM_EVENTS`

#### Properties inherited from YAHOO.util.AttributeProvider:

`_configs`

#### Properties inherited from YAHOO.util.EventProvider:

`__yui_events, __yui_subscribers`

### Methods

#### _getSelectedItem

`protected Number _getSelectedItem ( val )`
Get the value for the selected item.

Parameters:
  `val <Number>` The new value for "selected" item

Returns: `Number`
  The new value that would be set

#### _itemClickHandler

`protected void _itemClickHandler ( ev )`
The "click" handler for the item.

Parameters:
  `ev <Event>` The event object

Returns: `void`

#### _keyboardEventHandler

`protected void _keyboardEventHandler ( ev )`
The keyboard event handler for Carousel.

Parameters:
  `ev <Event>` The event that is being handled.

Returns: `void`

#### _pagerClickHandler

`protected void _pagerClickHandler ( ev )`
The "click" handler for the pager navigation.

Parameters:
  `ev <Event>` The event object

Returns: `void`

#### _setClipContainerSize

`protected void _setClipContainerSize ( clip , num )`
Set the clip container size (based on the new numVisible value).

Parameters:
  `clip <HTMLElement>` The clip container element.
  `num <Number>` optional The number of items per page.

Returns: `void`

#### _setContainerSize

`protected void _setContainerSize ( clip , attr )`
Set the container size.

Parameters:
  `clip <HTMLElement>` The clip container element.
  `attr <String>` Either set the height or width.

Returns: `void`

#### _setFirstVisible

`protected Number _setFirstVisible ( val )`
Set the value for the Carousel's first visible item.

Parameters:
  `val <Number>` The new value for firstVisible

Returns: `Number`
  The new value that would be set

#### _setNavigation

`protected Object _setNavigation ( cfg )`
Set the value for the Carousel's navigation.

Parameters:
  `cfg <Object>` The navigation configuration

Returns: `Object`
  The new value that would be set

#### _setNumItems

`protected Number _setNumItems ( val )`
Set the number of items in the Carousel. Warning: Setting this to a lower number than the current removes items from the end.

Parameters:
  `val <Number>` The new value for numItems

Returns: `Number`
  The new value that would be set

#### _setNumVisible

`protected Number _setNumVisible ( val )`
Set the value for the number of visible items in the Carousel.

Parameters:
  `val <Number>` The new value for numVisible

Returns: `Number`
  The new value that would be set

#### _setOrientation

`protected Boolean _setOrientation ( val )`
Set the orientation of the Carousel.

Parameters:
  `val <Boolean>` The new value for isVertical

Returns: `Boolean`
  The new value that would be set

#### _setRevealAmount

`protected Number _setRevealAmount ( val )`
Set the value for the reveal amount percentage in the Carousel.

Parameters:
  `val <Number>` The new value for revealAmount

Returns: `Number`
  The new value that would be set

#### _setSelectedItem

`protected void _setSelectedItem ( val )`
Set the value for the selected item.

Parameters:
  `val <Number>` The new value for "selected" item

Returns: `void`

#### _setupCarouselNavigation

`protected void _setupCarouselNavigation ( )`
Setup/Create the Carousel navigation element (if needed).

Returns: `void`

#### _syncPagerUI

`protected void _syncPagerUI ( )`
Synchronize and redraw the Pager UI if necessary.

Returns: `void`

#### _updateNavButtons

`protected void _updateNavButtons ( el , setFocus )`
Set the correct class for the navigation buttons.

Parameters:
  `el <Object>` The target button
  `setFocus <Boolean>` True to set focus ring, false otherwise.

Returns: `void`

#### _updateTabIndex

`protected void _updateTabIndex ( el )`
Set the correct tab index for the Carousel items.

Parameters:
  `el <Object>` The element to be focussed

Returns: `void`

#### _validateAnimation

`protected Boolean _validateAnimation ( cfg )`
Validate animation parameters.

Parameters:
  `cfg <Object>` The animation configuration

Returns: `Boolean`
  The status of the validation

#### _validateFirstVisible

`protected Boolean _validateFirstVisible ( val )`
Validate the firstVisible value.

Parameters:
  `val <Number>` The first visible value

Returns: `Boolean`
  The status of the validation

#### _validateNavigation

`protected Boolean _validateNavigation ( cfg )`
Validate and navigation parameters.

Parameters:
  `cfg <Object>` The navigation configuration

Returns: `Boolean`
  The status of the validation

#### _validateNumItems

`protected Boolean _validateNumItems ( val )`
Validate the numItems value.

Parameters:
  `val <Number>` The numItems value

Returns: `Boolean`
  The status of the validation

#### _validateNumVisible

`protected Boolean _validateNumVisible ( val )`
Validate the numVisible value.

Parameters:
  `val <Number>` The numVisible value

Returns: `Boolean`
  The status of the validation

#### _validateRevealAmount

`protected Boolean _validateRevealAmount ( val )`
Validate the revealAmount value.

Parameters:
  `val <Number>` The revealAmount value

Returns: `Boolean`
  The status of the validation

#### _validateScrollIncrement

`protected Boolean _validateScrollIncrement ( val )`
Validate the scrollIncrement value.

Parameters:
  `val <Number>` The scrollIncrement value

Returns: `Boolean`
  The status of the validation

#### addItem

`Boolean addItem ( item , index )`
Insert or append an item to the Carousel.

Parameters:
  `item <String | Object | HTMLElement>` The item to be appended to the Carousel. If the parameter is a string, it is assumed to be the content of the newly created item. If the parameter is an object, it is assumed to supply the content and an optional class and an optional id of the newly created item.
  `index <Number>` optional The position to where in the list (starts from zero).

Returns: `Boolean`
  Return true on success, false otherwise

#### addItems

`Boolean addItems ( items )`
Insert or append multiple items to the Carousel.

Parameters:
  `items <Array} An array of items to be added with each item representing an item, index pair [{item, index>` , ...]

Returns: `Boolean`
  Return true on success, false otherwise

#### autoScroll

`private void autoScroll ( )`
Automatically scroll the contents of the Carousel.

Returns: `void`

#### blur

`void blur ( )`
Remove focus from the Carousel.

Returns: `void`

#### clearItems public

`void clearItems public ( )`
Clears the items from Carousel.

Returns: `void`

#### createCarousel

`protected void createCarousel ( elId )`
Create the Carousel.

Parameters:
  `elId <String>` The id of the element to be created

Returns: `void`

#### createCarouselClip

`protected void createCarouselClip ( )`
Create the Carousel clip container.

Returns: `void`

#### createCarouselItem

`protected void createCarouselItem ( obj )`
Create the Carousel item.

Parameters:
  `obj <Object>` The attributes of the element to be created

Returns: `void`

#### createElement

`private void createElement ( el , attrs )`
Create an element, set its class name and optionally install the element to its parent.

Parameters:
  `el <String>` The element to be created
  `attrs <Object>` Configuration of parent, class and id attributes. If the content is specified, it is inserted after creation of the element. The content can also be an HTML element in which case it would be appended as a child node of the created element.

Returns: `void`

#### focus

`void focus ( )`
Set focus on the Carousel.

Returns: `void`

#### getById

`static void getById ( )`
Return the appropriate Carousel object based on the id associated with the Carousel element or false if none match.

Returns: `void`

#### getCarouselItemSize

`private void getCarouselItemSize ( which )`
Compute and return the height or width of a single Carousel item depending upon the orientation.

Parameters:
  `which <String>` "height" or "width" to be returned. If this is passed explicitly, the calculated size is not cached.

Returns: `void`

#### getElementForItem

`Element getElementForItem ( index )`
Return the ITEM_TAG_NAME at index or null if the index is not found.

Parameters:
  `index <Number>` The index of the item to be returned

Returns: `Element`
  Return the item at index or null if not found

#### getElementForItems

`Array getElementForItems ( )`
Return the ITEM_TAG_NAME for all items in the Carousel.

Returns: `Array`
  Return all the items

#### getItem

`Object getItem ( index )`
Return the item at index or null if the index is not found.

Parameters:
  `index <Number>` The index of the item to be returned

Returns: `Object`
  Return the item at index or null if not found

#### getItemPositionById

`void getItemPositionById ( index )`
Return the position of the Carousel item that has the id "id", or -1 if the id is not found.

Parameters:
  `index <Number>` The index of the item to be returned

Returns: `void`

#### getItems

`Array getItems ( )`
Return all items as an array.

Returns: `Array`
  Return all items in the Carousel

#### getScrollOffset

`private void getScrollOffset ( delta )`
Return the scrolling offset size given the number of elements to scroll.

Parameters:
  `delta <Number>` The delta number of elements to scroll by.

Returns: `void`

#### getStyle

`private void getStyle ( el , style , type )`
Get the computed style of an element.

Parameters:
  `el <HTMLElement>` The element for which the style needs to be returned.
  `style <String>` The style attribute
  `type <String>` "int", "float", etc. (defaults to int)

Returns: `void`

#### hide

`void hide ( )`
Hide the Carousel.

Returns: `void`

#### init

`void init ( el , attrs )`
Initialize the Carousel.

Parameters:
  `el <HTMLElement | String>` The html element that represents the Carousel container.
  `attrs <Object>` The set of configuration attributes for creating the Carousel.

Returns: `void`

#### initAttributes

`void initAttributes ( attrs )`
Initialize the configuration attributes used to create the Carousel.

Parameters:
  `attrs <Object>` The set of configuration attributes for creating the Carousel.

Returns: `void`

#### initEvents

`void initEvents ( )`
Initialize and bind the event handlers.

Returns: `void`

#### loadItems

`private void loadItems ( )`
The load the required set of items that are needed for display.

Returns: `void`

#### parseCarousel

`protected Boolean parseCarousel ( parent )`
Find the Carousel within a container. The Carousel is identified by the first element that matches the carousel element tag or the element that has the Carousel class.

Parameters:
  `parent <HTMLElement>` The parent element to look under

Returns: `Boolean`
  True if Carousel is found, false otherwise

#### parseCarouselItems

`protected void parseCarouselItems ( )`
Find the items within the Carousel and add them to the items table. A Carousel item is identified by elements that matches the carousel item element tag.

Returns: `void`

#### parseCarouselNavigation

`protected Boolean parseCarouselNavigation ( parent )`
Find the Carousel navigation within a container. The navigation elements need to match the carousel navigation class names.

Parameters:
  `parent <HTMLElement>` The parent element to look under

Returns: `Boolean`
  True if at least one is found, false otherwise

#### removeItem

`Boolean removeItem ( index )`
Remove an item at index from the Carousel.

Parameters:
  `index <Number>` The position to where in the list (starts from zero).

Returns: `Boolean`
  Return true on success, false otherwise

#### render

`Boolean render ( appendTo )`
Render the Carousel.

Parameters:
  `appendTo <HTMLElement | String>` The element to which the Carousel should be appended prior to rendering.

Returns: `Boolean`
  Status of the operation

#### scrollBackward

`void scrollBackward ( )`
Scroll the Carousel by an item backward.

Returns: `void`

#### scrollForward

`void scrollForward ( )`
Scroll the Carousel by an item forward.

Returns: `void`

#### scrollPageBackward

`private void scrollPageBackward ( ev , obj )`
Scroll the Carousel by a page backward.

Parameters:
  `ev <Event>` The event object
  `obj <Object>` The context object

Returns: `void`

#### scrollPageForward

`private void scrollPageForward ( ev , obj )`
Scroll the Carousel by a page forward.

Parameters:
  `ev <Event>` The event object
  `obj <Object>` The context object

Returns: `void`

#### scrollTo

`void scrollTo ( item , dontSelect )`
Scroll the Carousel to make the item the first visible item.

Parameters:
  `item <object>` Number The index of the element to position at.
  `dontSelect <object>` Boolean True if select should be avoided

Returns: `void`

#### setItemSelection

`private void setItemSelection ( newposition , oldposition )`
Set the selected item.

Parameters:
  `newposition <Number>` The index of the new position
  `oldposition <Number>` The index of the previous position

Returns: `void`

#### show

`void show ( )`
Display the Carousel.

Returns: `void`

#### startAutoPlay

`void startAutoPlay ( )`
Start auto-playing the Carousel.

Returns: `void`

#### stopAutoPlay

`void stopAutoPlay ( )`
Stop auto-playing the Carousel.

Returns: `void`

#### syncNavigation

`private void syncNavigation ( )`
Fire custom events for enabling/disabling navigation elements.

Returns: `void`

#### syncUI

`private void syncUI ( o )`
Fire custom events for synchronizing the DOM.

Parameters:
  `o <Object>` The item that needs to be added or removed

Returns: `void`

#### toString

`String toString ( )`
Return the string representation of the Carousel.

Returns: `String`

#### Methods inherited from YAHOO.util.Element:

`_registerHTMLAttr, addClass, addListener, appendChild, appendTo, fireQueue, getElementsByClassName, getElementsByTagName, getStyle, hasChildNodes, hasClass, initAttributes, insertBefore, on, removeChild, removeClass, removeListener, replaceChild, replaceClass, setStyle, subscribe`

#### Methods inherited from YAHOO.util.AttributeProvider:

`configureAttribute, fireBeforeChangeEvent, fireChangeEvent, get, getAttributeConfig, getAttributeKeys, refresh, register, resetAttributeConfig, resetValue, set, setAttributeConfig, setAttributes`

#### Methods inherited from YAHOO.util.EventProvider:

`createEvent, fireEvent, hasEvent, subscribe, unsubscribe, unsubscribeAll`

### Events

#### afterScroll

`afterScroll ( )`
Fires when the Carousel has scrolled to the previous or next page. Passes back the index of the first and last visible items in the Carousel. See Element.addListener for more information on listening for this event.

#### animationChange

`animationChange ( event )`
Fires when the value for the configuration attribute 'animation' changes.

Parameters:
  `event <{oldValue: any, newValue: any}>` An object containing the previous attribute value and the new value.

#### autoPlayChange

`autoPlayChange ( event )`
Fires when the value for the configuration attribute 'autoPlay' changes.

Parameters:
  `event <{oldValue: any, newValue: any}>` An object containing the previous attribute value and the new value.

#### beforeAnimationChange

`beforeAnimationChange ( event )`
Fires before the value for the configuration attribute 'animation' changes. Return false to cancel the attribute change.

Parameters:
  `event <{oldValue: any, newValue: any}>` An object containing the previous attribute value and the new value.

#### beforeAutoPlayChange

`beforeAutoPlayChange ( event )`
Fires before the value for the configuration attribute 'autoPlay' changes. Return false to cancel the attribute change.

Parameters:
  `event <{oldValue: any, newValue: any}>` An object containing the previous attribute value and the new value.

#### beforeCurrentPageChange

`beforeCurrentPageChange ( event )`
Fires before the value for the configuration attribute 'currentPage' changes. Return false to cancel the attribute change.

Parameters:
  `event <{oldValue: any, newValue: any}>` An object containing the previous attribute value and the new value.

#### beforeFirstVisibleChange

`beforeFirstVisibleChange ( event )`
Fires before the value for the configuration attribute 'firstVisible' changes. Return false to cancel the attribute change.

Parameters:
  `event <{oldValue: any, newValue: any}>` An object containing the previous attribute value and the new value.

#### beforeHide

`beforeHide ( )`
Fires before the Carousel is hidden. See Element.addListener for more information on listening for this event.

#### beforeIsCircularChange

`beforeIsCircularChange ( event )`
Fires before the value for the configuration attribute 'isCircular' changes. Return false to cancel the attribute change.

Parameters:
  `event <{oldValue: any, newValue: any}>` An object containing the previous attribute value and the new value.

#### beforeIsVerticalChange

`beforeIsVerticalChange ( event )`
Fires before the value for the configuration attribute 'isVertical' changes. Return false to cancel the attribute change.

Parameters:
  `event <{oldValue: any, newValue: any}>` An object containing the previous attribute value and the new value.

#### beforeNavigationChange

`beforeNavigationChange ( event )`
Fires before the value for the configuration attribute 'navigation' changes. Return false to cancel the attribute change.

Parameters:
  `event <{oldValue: any, newValue: any}>` An object containing the previous attribute value and the new value.

#### beforeNumItemsChange

`beforeNumItemsChange ( event )`
Fires before the value for the configuration attribute 'numItems' changes. Return false to cancel the attribute change.

Parameters:
  `event <{oldValue: any, newValue: any}>` An object containing the previous attribute value and the new value.

#### beforeNumVisibleChange

`beforeNumVisibleChange ( event )`
Fires before the value for the configuration attribute 'numVisible' changes. Return false to cancel the attribute change.

Parameters:
  `event <{oldValue: any, newValue: any}>` An object containing the previous attribute value and the new value.

#### beforePageChange

`beforePageChange ( )`
Fires when the Carousel is about to scroll to the previous or next page. Passes back the page number of the current page. Note that the first page number is zero. See Element.addListener for more information on listening for this event.

#### beforeRevealAmountChange

`beforeRevealAmountChange ( event )`
Fires before the value for the configuration attribute 'revealAmount' changes. Return false to cancel the attribute change.

Parameters:
  `event <{oldValue: any, newValue: any}>` An object containing the previous attribute value and the new value.

#### beforeScroll

`beforeScroll ( )`
Fires when the Carousel is about to scroll to the previous or next page. Passes back the index of the first and last visible items in the Carousel and the direction (backward/forward) of the scroll. See Element.addListener for more information on listening for this event.

#### beforeScrollIncrementChange

`beforeScrollIncrementChange ( event )`
Fires before the value for the configuration attribute 'scrollIncrement' changes. Return false to cancel the attribute change.

Parameters:
  `event <{oldValue: any, newValue: any}>` An object containing the previous attribute value and the new value.

#### beforeSelectedItemChange

`beforeSelectedItemChange ( event )`
Fires before the value for the configuration attribute 'selectedItem' changes. Return false to cancel the attribute change.

Parameters:
  `event <{oldValue: any, newValue: any}>` An object containing the previous attribute value and the new value.

#### beforeSelectOnScrollChange

`beforeSelectOnScrollChange ( event )`
Fires before the value for the configuration attribute 'selectOnScroll' changes. Return false to cancel the attribute change.

Parameters:
  `event <{oldValue: any, newValue: any}>` An object containing the previous attribute value and the new value.

#### beforeShow

`beforeShow ( )`
Fires when the Carousel is about to be shown. See Element.addListener for more information on listening for this event.

#### blur

`blur ( )`
Fires when the Carousel loses focus. See Element.addListener for more information on listening for this event.

#### currentPageChange

`currentPageChange ( event )`
Fires when the value for the configuration attribute 'currentPage' changes.

Parameters:
  `event <{oldValue: any, newValue: any}>` An object containing the previous attribute value and the new value.

#### firstVisibleChange

`firstVisibleChange ( event )`
Fires when the value for the configuration attribute 'firstVisible' changes.

Parameters:
  `event <{oldValue: any, newValue: any}>` An object containing the previous attribute value and the new value.

#### focus

`focus ( )`
Fires when the Carousel gains focus. See Element.addListener for more information on listening for this event.

#### hide

`hide ( )`
Fires when the Carousel is hidden. See Element.addListener for more information on listening for this event.

#### isCircularChange

`isCircularChange ( event )`
Fires when the value for the configuration attribute 'isCircular' changes.

Parameters:
  `event <{oldValue: any, newValue: any}>` An object containing the previous attribute value and the new value.

#### isVerticalChange

`isVerticalChange ( event )`
Fires when the value for the configuration attribute 'isVertical' changes.

Parameters:
  `event <{oldValue: any, newValue: any}>` An object containing the previous attribute value and the new value.

#### itemAdded

`itemAdded ( )`
Fires when an item has been added to the Carousel. Passes back the content of the item that would be added, the index at which the item would be added, and the event itself. See Element.addListener for more information on listening for this event.

#### itemRemoved

`itemRemoved ( )`
Fires when an item has been removed from the Carousel. Passes back the content of the item that would be removed, the index from which the item would be removed, and the event itself. See Element.addListener for more information on listening for this event.

#### itemSelected

`itemSelected ( )`
Fires when an item has been selected in the Carousel. Passes back the index of the selected item in the Carousel. Note, that the index begins from zero. See Element.addListener for more information on listening for this event.

#### loadItems

`loadItems ( )`
Fires when the Carousel needs more items to be loaded for displaying them. Passes back the first and last visible items in the Carousel, and the number of items needed to be loaded. See Element.addListener for more information on listening for this event.

#### navigationChange

`navigationChange ( event )`
Fires when the value for the configuration attribute 'navigation' changes.

Parameters:
  `event <{oldValue: any, newValue: any}>` An object containing the previous attribute value and the new value.

#### navigationStateChange

`navigationStateChange ( )`
Fires when the state of either one of the navigation buttons are changed from enabled to disabled or vice versa. Passes back the state (true/false) of the previous and next buttons. The value true signifies the button is enabled, false signifies disabled. See Element.addListener for more information on listening for this event.

#### numItemsChange

`numItemsChange ( event )`
Fires when the value for the configuration attribute 'numItems' changes.

Parameters:
  `event <{oldValue: any, newValue: any}>` An object containing the previous attribute value and the new value.

#### numVisibleChange

`numVisibleChange ( event )`
Fires when the value for the configuration attribute 'numVisible' changes.

Parameters:
  `event <{oldValue: any, newValue: any}>` An object containing the previous attribute value and the new value.

#### pageChange

`pageChange ( )`
Fires after the Carousel has scrolled to the previous or next page. Passes back the page number of the current page. Note that the first page number is zero. See Element.addListener for more information on listening for this event.

#### render

`render ( )`
Fires when the Carousel is rendered. See Element.addListener for more information on listening for this event.

#### revealAmountChange

`revealAmountChange ( event )`
Fires when the value for the configuration attribute 'revealAmount' changes.

Parameters:
  `event <{oldValue: any, newValue: any}>` An object containing the previous attribute value and the new value.

#### scrollIncrementChange

`scrollIncrementChange ( event )`
Fires when the value for the configuration attribute 'scrollIncrement' changes.

Parameters:
  `event <{oldValue: any, newValue: any}>` An object containing the previous attribute value and the new value.

#### selectedItemChange

`selectedItemChange ( event )`
Fires when the value for the configuration attribute 'selectedItem' changes.

Parameters:
  `event <{oldValue: any, newValue: any}>` An object containing the previous attribute value and the new value.

#### selectOnScrollChange

`selectOnScrollChange ( event )`
Fires when the value for the configuration attribute 'selectOnScroll' changes.

Parameters:
  `event <{oldValue: any, newValue: any}>` An object containing the previous attribute value and the new value.

#### show

`show ( )`
Fires when the Carousel is shown. See Element.addListener for more information on listening for this event.

#### startAutoPlay

`startAutoPlay ( )`
Fires when the auto play has started in the Carousel. See Element.addListener for more information on listening for this event.

#### stopAutoPlay

`stopAutoPlay ( )`
Fires when the auto play has been stopped in the Carousel. See Element.addListener for more information on listening for this event.

#### Events inherited from YAHOO.util.Element:

`appendTo, available, beforeAppendTo, beforeElementChange, contentReady, elementChange,`

### Configuration Attributes

#### animation `- Object`

The optional animation attributes for the Carousel.
Default Value:
{ speed: 0, // the animation speed (in seconds)
effect: null } // the animation effect (like YAHOO.util.Easing.easeOut)

#### autoPlay `- Number`

Set this to time in milli-seconds to have the Carousel automatically scroll the contents.

#### currentPage `- Number`

The current page number (read-only.)

#### firstVisible `- Number`

The index to start the Carousel from (indexes begin from zero)
Default Value: 0

#### isCircular `- Boolean`

Set this to true to wrap scrolling of the contents in the Carousel.
Default Value: false

#### isVertical `- Boolean`

True if the orientation of the Carousel is vertical
Default Value: false

#### navigation `- Object`

The set of navigation controls for Carousel
Default Value:
{ prev: null, // the previous navigation element
next: null } // the next navigation element

#### numItems `- Number`

The number of items in the Carousel.

#### numVisible `- Number`

The number of visible items in the Carousel's viewport.
Default Value: 3

#### revealAmount `- Number`

The percentage of the item to be revealed on each side of the Carousel (before and after the first and last item in the Carousel's viewport.)
Default Value: 0

#### scrollIncrement `- Number`

The number of items to scroll by for arrow keys.
Default Value: 1

#### selectedItem `- Number`

The index of the selected item.

#### selectOnScroll `- Boolean`

Set this to true to automatically set focus to follow scrolling in the Carousel.
Default Value: true

#### Configuration attributes inherited from YAHOO.util.Element:

`element,`

Copyright © 2008 Yahoo! Inc. All rights reserved.