Forum Discussion
Paktolus
1 year agoCommunity Member
Results slide - Score progress bar
For the Results slide, I’d like to design a feature where the user’s score dynamically fills a progress bar based on their performance. For instance, if the user scores 25%, the bar should fill up to...
Paktolus
1 year agoCommunity Member
What javascript code would I need to use to achieve this?
Nedim
1 year agoCommunity Member
Just a few things need to be done for this to work.
1. Create a custom number variable called "score", set its default value to 0, and make it equal to the "QuizX.ScorePercent" variable when the timeline starts on this slide.
2. Insert two identical rectangle shapes: one for the score bar and one for the score bar fill. Assign them different colors (similar to what you already have based on your screenshot).
3. Right-click on the score bar fill shape and select Accessibility. In the Alt Text field, enter "score-bar-fill".
3. Add an Execute JavaScript trigger to run when the timeline starts on this slide.
You can find the entire code in the attached reference Story file.