Slider

The slider component displays a series of items one at a time, allowing users to move between them.

A slider has the following features:

• The ability to add as many slides as required.
• Optional arrow buttons that allow the user to move the the next or previous slide.
• Optional navigational bullets that allow the user to navigate to any slide.
• Optional progress bar on the bullets, showing how long until the slide disappears.

Available settings

Slides

Type: slide component

Add a new slide to the slider.

Duration of each slide (ms)

Type: text

Add how long you want each slide to appear on the screen, in milliseconds (1 second = 1000 milliseconds).

Duration of transitions between slides (ms)

Type: text

Add how long you want the transition between slides to be, in milliseconds (1 second = 1000 milliseconds).

Autoplay slideshow

Type: checkbox
Default: true

Define whether the slider should automatically cycle through each slide or not.

Show arrow buttons

Type: checkbox
Default: false

Define whether the slider should show the arrow navigational buttons or not. Arrows will appear halfway down the slider, to the extreme left and right of screen.

Show bullet navigation

Type: checkbox
Default: true

Define whether the slider should show the bullet navigational buttons or not. Bullets will appear at the bottom of the slider.

Use bullets as progress indicators

Type: checkbox
Default: false

Define whether the slider bullets should gradually “fill”, showing how long is left on the slide duration.

Align bullet navigation

Type: dropdown
Options: left | centre | right
Default: centre

Definre whether the bullet navigation should sit to the left of screen, the right of screen, or in the centre of screen.