Forum Discussion
Use triggers and variables to cycle through multiple layers in sequence
Hello, I have 73 images that I want to show in sequence to animate the wrapping function for the unit circle. I know that there are several ways to do this, but I'm not sure which is most efficient...
Here is an option to consider that keeps your slides uncluttered with unnecessary images and triggers.
Demo: https://360.articulate.com/review/content/b6d2d687-1a80-451c-b848-d539c8b0ec93/review
With this, you place a sequentially numbered collection of images inside a folder with a blank index.html file, and insert the folder as a web object (see Scene 2).
Set the woFolder variable with the name of the web object folder (see instructions in Scene 2).
You then insert the first image into your slide. Set the accessibility tag with the base part of the image filename (for example, first file= 2400101.png so base= 24001). Size and position as you wish.
Place the included JavaScript in a trigger (Scene 1).
Set the imgNumber variable with the image number you want displayed. My images start with 24001 and run from 2400101 to 2400172, so my variable goes from 1 to 72. The demo uses a slider or buttons to change images.
Activate the script trigger to set the current image to the number in the imgNumber variable.
First of all, thank you!
Is there a possibility I could see the .story file instead of viewing in Review 360 because I ran into the following hurdles:
I'm not sure how to set the accessibility tag - is that under Alternative Text? Also, should I set that as the tag for the web object or for the image?
Is the Javascript generated once I set the accessibility tag? I didn't see any code.
Based on your published file, it looks like I will still need to build a trigger that moves the slider variable?
Sorry, let's try again. I attached this yesterday, but the attachment files are being troublesome.
Still problems with zip, so try this link:
Right click on the picture entry in the timeline. Near the bottom of the menu is the Accessibility tag. Just type the name to use in the box. The JavaScript is in one of the triggers in the project, which I thought was attached. Oops. The slider and buttons were just for the demo. You just need to set the image number variable in some way and execute the JavaScript trigger. You can use a slider, which adjusts the variable automatically, or use buttons, which you would have to manually set with triggers. Or you can set the variable some other way. See the link in my other comment for the .story file and the demo web object folder with the images (which you don't need unless you want to rebuild the project from scratch, or change the images).
