CarouselModel API in JavaScript (ES5) Carousel API control

Interface for a class Carousel

Properties

slideChanged

EmitType<SlideChangedEventArgs>

The event will be fired after the slide changed.

slideChanging

EmitType<SlideChangingEventArgs>

The event will be fired before the slide change.

animationEffect

CarouselAnimationEffect

Specifies the type of animation effects. The possible values for this property as follows

• None: The carousel item transition happens without animation.
• Slide: The carousel item transition happens with slide animation.
• Fade: The Carousel item transition happens with fade animation.
• Custom: The Carousel item transition happens with custom animation. @default ‘Slide’

autoPlay

boolean

Defines whether the slide transition is automatic or manual.

buttonsVisibility

CarouselButtonVisibility

Defines how to show the previous, next and play pause buttons visibility. The possible values for this property as follows

• Hidden: Navigation buttons are hidden.
• Visible: Navigation buttons are visible.
• VisibleOnHover: Navigation buttons are visible only when we hover the carousel.

cssClass

string

Accepts single/multiple classes (separated by a space) to be used for carousel customization.

dataSource

Record[]

Specifies the datasource for the carousel items.

enablePersistence

boolean

Enable or disable persisting component’s state between page reloads.

enableRtl

boolean

Enable or disable rendering component in right to left direction.

enableTouchSwipe

boolean

Defines whether to enable swipe action in touch devices or not.

height

string | number

Specifies the height of the Carousel in pixels/number/percentage. The number value is considered as pixels.

htmlAttributes

Record

Accepts HTML attributes/custom attributes to add in individual carousel item.

indicatorsTemplate

string

Accepts the template for indicator buttons.

interval

number

Specifies the interval duration in milliseconds for carousel item transition.

itemTemplate

string

Specifies the template option for carousel items.

items

CarouselItemModel[]

Allows defining the collection of carousel item to be displayed on the Carousel.

locale

string

Overrides the global culture and localization value for this component. Default global culture is ‘en-US’.

loop

boolean

Defines whether the slide transitions loop end or not. When set to false, the transition stops at last slide.

nextButtonTemplate

string

Accepts the template for next navigation button.

partialVisible

boolean

Enables active slide with partial previous/next slides. Slide animation only applicable if the partialVisible is enabled.

pauseOnHover

boolean

Defines whether the slide transition gets pause on hover or not.

playButtonTemplate

string

Accepts the template for play/pause button.

previousButtonTemplate

string

Accepts the template for previous navigation button.

selectedIndex

number

Specifies index of the current carousel item.

showIndicators

boolean

Defines whether to show the indicator positions or not. The indicator positions allow to know the current slide position of the carousel component.

showPlayButton

boolean

Defines whether to show play button or not.

width

string | number

Specifies the width of the Carousel in pixels/number/percentage. The number value is considered as pixels.