Step 1

 ¶ 


There are two ways that you can setup the animation, let's take a look at the first way. Select Interact.

Step 2

 ¶ 


Select Triggers.

Step 3

 ¶ 


Select Is Changed under Variables.

Step 4

 ¶ 


The Pick a Trigger Popup shows with Variables open. Select the Select a Variable dropdown.

Step 5

 ¶ 


From the list, select Slider01(number).

Step 6

 ¶ 


Select Ok.

Step 7

 ¶ 


Select Equal to under Number.

Step 8

 ¶ 


Select Enter Value. We'll add 1 for you. (For slider position 1)

Step 9

 ¶ 


Select Next.

Step 10

 ¶ 


Select Animations and Effects in the side menu.

Step 11

 ¶ 


Select Move to under Motion.

Step 12

 ¶ 


Select Next.

Step 13

 ¶ 


The Page Actions and Timings Panel comes up, to finish setting up the positition 1 action select the Artwork element under Targets.

Step 14

 ¶ 


Under Coordinates select X input. We'll add 79 for you. (Or position 1 X value)

Step 15

 ¶ 


Select Y input. We'll add 70 for you. (Or position 1 Y value)

Step 16

 ¶ 


Select Apply.

Step 17

 ¶ 


Position 1 is now set. Next, we are going to setup position 2 using the second way to setup an animation. With the Page Actions and Timings panel open. Select Add.

Step 18

 ¶ 


Select Animations and Effects in the side menu.

Step 19

 ¶ 


Select Move to.

Step 20

 ¶ 


Select Next.

Step 21

 ¶ 


The Page Actions and Timings panel shows. Under Targets select the Artwork element.

Step 22

 ¶ 


Under Trigger select the dropdown.

Step 23

 ¶ 


Select When Variable is...

Step 24

 ¶ 


Under Variable select the dropdown.

Step 25

 ¶ 


Select the variable Slider01(number).

Step 26

 ¶ 


Operator will stay the same (==). Select the input for Value, and we'll add 2 for you. (For slider position 2)

Step 27

 ¶ 


Under Coordinates select the X input. We'll add 400 for you. (Or position 2 X value)

Step 28

 ¶ 


Select the Y input. We'll add 70 for you. (Or position 2 Y value)

Step 29

 ¶ 


Select Apply.

Step 30

 ¶ 


Select Add, and we'll repeat the steps used above for position 2.

Step 31

 ¶ 


Select Animations and Effects in the side menu.

Step 32

 ¶ 


Select Move to.

Step 33

 ¶ 


Select Next.

Step 34

 ¶ 


The Page Actions and Timings panel shows. Under Targets select the Artwork element.

Step 35

 ¶ 


Under Trigger select the dropdown.

Step 36

 ¶ 


Select When Variable is...

Step 37

 ¶ 


Under Variable select the dropdown.

Step 38

 ¶ 


Select the variable Slider01(number).

Step 39

 ¶ 


Operator will stay the same (==). Select the input for Value, and we'll add 3 for you. (For slider position 3)

Step 40

 ¶ 


Under Coordinates select the X input. We'll add 700 for you. (Or position 3 X value)

Step 41

 ¶ 


Select the Y input. We'll add 70 for you. (Or position 3 Y value)

Step 42

 ¶ 


Select Apply.

Step 43

 ¶ 


Position 3 is now set. Select Preview.

Step 44

 ¶ 


The element starts at position 1. Select the middle of the slider.

Step 45

 ¶ 


The element moved to position 2. Select the end of the slider.

Step 46

 ¶ 


The element moved to position 3. Select the Red Circle in the top left corner of the preview window to close it.

Step 47

 ¶ 


The element now moves when the slider is moved to positions 1, 2, or 3.

  0     0

Similar Projects

thumbnail image
Adding a Publish Target to an Element on a Page
2023-08-02

You can have Elements on any Page targeting multiple learning audiences or contexts

1 min read
avatar
Chris Van Wingerden
thumbnail image
Adding a Baseline Page (Template) as new Sections on a Flow Page or new Layers on a Claro page
2023-02-09

Speed up development time by using Baseline Projects as your own template library for Sections or Layers

1 min read
avatar
Chris Van Wingerden
thumbnail image
Adding A Slider and Setting up the Slider Variable
2022-01-11

Steps to add a Slider and setting up the Slider Variable.

avatar
Laura Bertrand
thumbnail image
Let Users Take Notes on a Page and Print
2023-03-24

Aggregate All Page Notes on a Page and Print

1 min read
avatar
Brent Schlenker
thumbnail image
Gather Coordinates of an element on a page
2022-01-07

Steps to gather the x and y coordinates for each position you want the element to move to when the slider is changed.

avatar
Laura Bertrand
thumbnail image
Rearranging the Order of Things on a Flow Page
2023-03-23

Easily move and re-order Sections, Rows, Groups and Elements within their respective container

1 min read
avatar
Chris Van Wingerden
thumbnail image
Publishing a Capture file as an animated GIF to a dominKnow | ONE page
2022-07-21

Animated GIFs are a great option for showing simple tasks

3 min read
avatar
Chris Van Wingerden
thumbnail image
Viewing All Actions on a Page and Editing an Action's Settings
2021-05-03

Steps to edit the settings for an action using the Actions tab.

As you add Actions to a Page, they are listed on the Actions tab on the left side of the Stage.

You can use this tab to open Actions to edit them.

This tab is also helpful for understanding all the Actions or events on a Page, especially if you aren't the original author but are trying to make updates.

avatar
Chris Van Wingerden
thumbnail image
The Left-Side Panel - Project, Page and Actions tabs
2019-04-08

Tools and features to help as you author your Project

1 min read
avatar
Chris Van Wingerden
thumbnail image
Adding and editing a Hotspot Image question Page
2021-05-31

Hotspot image question pages can be used as either scored Test Questions or as non-scored Practice questions

1 min read
avatar
Chris Van Wingerden

Questions  ( 0 )

Sign in to ask or answer a question.

Comments ( 0 )

Sign in to join the discussion.