Wheel of Fortune Style Spinner

Nov 29, 2017

Attached is my version of a Wheel of Fortune style of spinner. 

  • The spinner leverages the dial functionality of SL3/360.
  • The amount of spin is determined by a random variable generated by JavaScript each time you press the spin button but it will always make at least 1 full rotation.
  • The wheel always starts from where you left it. 
  • There is no limit to the number of times you can spin the wheel.

Hopefully someone will have some use for this.

Link to Demo

9 Replies

I hate to disappoint you Montse, but I cheated and used regular ol' JavaScript. I needed to reset the random number for each spin but not restart the slide each time. I haven't worked with the new random number variable enough to know how to do that so I went with what I know. :-)

I also wanted this to be accessible to SL3 users. 


Things to keep in mind:

  1. All dials have a starting and an ending value.  If a users uses their mouse to rotate the dial, they cannot go beyond the start or the ending value, even in a full 360° dial. 
  2. All dials control (or can be controlled by) an assigned variable. Rotating the dial changes the variable's value. Changing the variable's value, rotates the dial.
  3. Any image can be converted into a dial.

So, in my example, I am using an off-screen animation to add 1 to the dial to achieve the rotation and subtracting 1 from a randomly generated control number that tells me how many times to do this.  But because my dial has a start value of 1 and a top value of 11, it can't move to a value of 12.  By monitoring the dial value, I can subtract 10 from the variable instead of adding 1 anytime the value is 11 so the dial "moves" from its end position to its starting one.  Visually, this looks just like a continuation of the rotation when in reality, it is a reset to the lowest (initial) value. 

This discussion is closed. You can start a new discussion or contact Articulate Support.