new Carousel(id, properties) → {Object}
Parameters:
| Name |
Type |
Description |
id |
String
|
The id of the component. |
properties |
Object
|
HTMLElement
|
The properties used to initialize the component or the container element. |
- Mixes In:
Returns:
An instance of the component.
-
Type
-
Object
Extends
Classes
- CarouselEvents
Members
animation :animation
Carousel slide animation.
Type:
Properties:
| Name |
Type |
Default |
Description |
cssClass |
String
|
slide-animation
|
Gets or sets the css class that is applied to the element to provide the slide animation/transition. |
dragNavigation :Boolean
Gets or sets a value indicating if items can be selected by dragging.
Type:
dragRevealPercentage :Number
Gets or sets the percentage of the item to be visible before the item is selected.
Type:
dragSelectSpeed :Number
Gets or sets the drag speed (moved pixels relative to the elapsed time) required to select the designated item when the reveal percentage has not been matched.
Type:
Type:
fullscreen :Boolean
Gets or sets a value indicating if the carousel takes the full screen size.
Type:
horizontal :Boolean
Gets or sets a value indicating if the carousel is rendered horizontal.
Type:
initialTransition :Boolean
Gets or sets a value indicating if there is a transition animation on initial item select.
Type:
keyboardNavigation :Boolean
Gets or sets a value indicating if items can be selected with the keyboard.
With the option horizontal enabled only the left/right arrow keys can be used.
When rendered vertically the up/down arrows, page up/down, home (first item) and end (last item) keys can be used.
Type:
rotateInterval :Number
Gets or sets the interval in milliseconds for automatic carousel rotation.
Type:
selectedIndex :Number
Gets or sets the initial selected item index.
Type:
wheelNavigation :Boolean
Gets or sets a value indicating if items can be selected with the mouse wheel.
Type:
Methods
destroy(keepEvents)
Parameters:
| Name |
Type |
Description |
keepEvents |
Boolean
|
A value indicating if component events should be kept. |
getSelectedIndex() → {Number}
Gets the index of the selected item.
Returns:
The index of the selected item.
-
Type
-
Number
postRender()
Handles the post render procedure.
render()
selectItem(index, instantopt)
Selects the item with the specified index.
Parameters:
| Name |
Type |
Attributes |
Description |
index |
Number
|
|
The index of the item. |
instant |
Boolean
|
<optional>
|
A value indicating if the item must be selected instantly (without transition animation). |
start(intervalopt)
Starts rotating the slide items automatically.
Parameters:
| Name |
Type |
Attributes |
Description |
interval |
Number
|
<optional>
|
The interval in milliseconds before moving to the next item. |
suppressNextChangeEvent(action)
Suppresses any change events fired by the underlying input element during the execution of the provided action. Use this when programmatically setting a component value to prevent the change event from propagating as a user interaction.
The suppression is automatically lifted after the action completes, even if it throws.
Parameters:
| Name |
Type |
Description |
action |
function
|
The action to execute with change events suppressed. |
- Mixes In:
Type Definitions
CarouselEventArgs
Carousel event arguments.
Type:
Properties:
| Name |
Type |
Attributes |
Description |
index |
Number
|
|
The index of the selected item. |
previousIndex |
Number
|
<optional>
|
The index of the previously selected item (onItemSelect only; undefined on the first select). |