Carousel (Bootstrap)

Description

See Bootstrap's docs for full information

A slideshow component for cycling through elements—images or slides of text—like a carousel.

How it works The carousel is a slideshow for cycling through a series of content. It works with a series of images, text, or custom markup. It also includes support for previous/next controls and indicators.

Nested carousels are not supported. You should also be aware that carousels in general can often cause usability and accessibility challenges.

Properties and Methods

Standard properties are supported, plus:

autoplay	Set to Carousel to start playing immediately, set to Ride to start after user interaction.
buttons	Show Prev and Next buttons on the image, for user to scroll.
captions	Captions for each image, one per line.
crossfade	Use a crossfade when going to next slide.
descriptions	Descriptions for each image, one per line.
images	A list of images, one per line. Most image formats are supported.
indicators	Show indicators to go to slides directly?
interval	How long to display an image before going to next one. In milliseconds. Default 2000.

Methods

Use:

$("#Carousel1").carousel("pause")
$("#Carousel1").carousel(0)

cycle	Starts cycling through the carousel items from left to right.
next	Cycles to the next slide.
pause	Stops the carousel.
prev	Cycles to the previous slide.
(n)	Cycles to the nth slide

Events

Standard events are supported. For this control, the onclick event will be most useful.

Example

// JavaScript
Button1.onclick = function () {
  $("#Carousel1").carousel("pause");
};

Button2.onclick = function () {
  $("#Carousel1").carousel(0);
};

' Basic
Function Button1_onclick()
  $("#Carousel1").carousel("pause")
End Function

Function Button2_onclick()
  $("#Carousel1").carousel(0)
End Function