Forum Discussion
Paktolus
6 months 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
6 months agoCommunity Member
What javascript code would I need to use to achieve this?
Nedim
5 months 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.