I find it easier to use a custom state than the built-in Visited state. I called my custom state Complete. I deleted every other state except Normal, Hover, and Disabled.
Set the initial state of all buttons to Disabled.
Add these triggers to the base layer:
- Change the state of the next button to disabled when the timeline starts if Slide_1 = False
(This is a variable I created so once you have seen the page, you can advance without having to review it again if you navigated there in error)
- Change the state of button 1 to Normal when the timeline ends on this slide
- Add triggers to the buttons to jump to the correct layer when the user clicks the button
- Change the state of the Next button to Normal when the state of all buttons are = Complete
- Adjust the Slide_1 variable to True when the state of all button are = Complete
Add these triggers to Layer 1:
- Change the state of Button 1 to Complete when the timeline ends on this layer
- Change the state of Button 2 to Normal when the timeline end on this layer IF the state of Button 2 is disabled (you don't want to have it change to normal if the corresponding layer has already been viewed).
Add these to layer 2 (and any others, except the final layer):
- Change the state of Button 2 to Complete when the timeline ends on this layer
- Change the state of Button 3 to Normal when the timeline end on this layer IF the state of Button 3 is disabled
Add this to layer 3:
- Change the state of Button 3 to Complete when the timeline ends on this layer
On each layer I have a "Mask". It is a shape with a solid fill and set to 100% transparency. It ends in the timeline before the layer timeline ends. So if the duration of the layer timeline is 5 seconds, it ends at 4.75 seconds. This prevents users from clicking the other buttons before I want them to.
NOTE: A shape with no fill will not work, it is hollow. A shape with a solid fill but 100% transparency is still a shape with a solid fill.
You can see how it all works and the triggers in the attached file.
