Use interactive sliders to let learners manipulate data, explore cause-and-effect relationships, and control other objects in the course.

Adding Sliders

Go to the Insert tab on the ribbon, click Slider, choose a slider type, and click the slide where you want the slider to appear.

Tip: By default, sliders are horizontal, but you can make them vertical if you'd like. Just rotate them 90 degrees. You can use the rotation handle at the top of the slider or the Rotate drop-down on the ribbon.

Rotate interactive sliders to suit your needs

Resizing Sliders

Sliders have a track and a thumb that slides along the track.

Each slider has a track and a thumb that slides along the track.

The track and thumb can be resized together or individually.

  • To resize the whole slider (track and thumb), drag a corner sizing handle.
  • To change the length of the track, drag the left or right sizing handle.
  • To change the thickness of the track, drag the left yellow handle up or down.
  • To resize the slider thumb, drag the top yellow handle up or down.

How to change the size of sliders, tracks, and thumbs

Setting Slider Properties

To control the behavior of a slider, select the slider, go to the Slider Tools—Design tab on the ribbon, and adjust the following properties.

Variable

This is the variable associated with your slider. Storyline automatically creates a number variable for each slider in your course.

If you want to change the variable that's controlled by a slider, use this drop-down to select another number variable in your course.

Learn more about variables here.

Update

This controls when the variable gets updated. You can update the variable as the learner is dragging the slider (which is the default setting) or only after the learner releases it.

Start

This is the starting value for your slider. It defaults to zero. (It can have up to two decimal places.)

End

This is the ending value for your slider. It defaults to 10. (It can have up to two decimal places.)

Initial

This is the starting position for the slider thumb. It defaults to zero. (It can have up to two decimal places.)

Step

This is the incremental value for the slider thumb as it moves along its track. It defaults to one. (It can have up to two decimal places.)

Renaming Sliders

Storyline gives each slider a default name: Slider 1, Slider 2, etc. We recommend giving them more intuitive names, so they're recognizable when adding triggers and creating freeform interactions.

One way to rename a slider is to right-click it, select Rename, enter a new name, and click OK.

Another way is to double-click the slider in the timeline to open it for editing, enter a new name, and press Enter on your keyboard.

Formatting Sliders

To change the styles, colors, and effects for a slider, select the slider, go to the Slider Tools—Format tab on the ribbon, and use the formatting options.

The colors available on the Format tab come from your theme colors.

Triggering Actions

Generally, you'll want to perform one or more actions based on a learner's interaction with the slider. To do that, you'll need to add triggers that execute when the slider moves or the variable changes.

For example, you might change the state of an object when the learner drags the slider.

How to trigger actions when learners interact with a slider

To learn more about triggers, see this user guide.

Displaying Slider Values in Text Elements

There may be times when you want to display the value of a slider in a text box or shape. It’s easy to do. Just add a variable reference to any text element in your course.

When the learner drags the slider, the value that's displayed in the text element automatically updates to show the value they selected.

Use variable references to display the current value of a slider in a text box or shape

Deleting Sliders

To delete a slider, select it on the slide or in the timeline, then click Delete on your keyboard.