Skip to main content

Slider

A component which displays its children in a slideshow or carousel.

Options#

  • title | string: title for the slideshow / carousel to be displayed at its top. Default: ''.
  • dots | boolean: display dots at the bottom for quickly navigating to any slide. Default: true.
  • fade | boolean: controls whether fading is used for transitioning between the slides. Default: false.
  • draggable | boolean: controls whether users can drag the slides to navigate between them. Default: false.
  • pagination | string: whether to show the pagination either on the top, bottom, or both. Default: 'bottom'`.
  • goto | number: If property is changed, the component jumps to the slide with the selected index. Default: 0.
  • infinite | boolean: controls whether the slideshow wraps around it's contents. Default: false.
  • interval | number: sets a time interval for an automatic slide change. Default: none.
  • swipe | boolean: enables drag/swipe behavior. Default: false.
  • style | object: CSS inline styles. Default: {}.
  • onClick | function: callback invoked when clicking on the next/previous buttons. Default: onClick() {}.

Examples#

Live Editor
Result
ReferenceError: Provider is not defined