Text overlay with hotspots

Mar 04, 2024

I have multiple text boxes and hotspots over an image.

For each hotspot selected (7 in total), the related text box appears. I have set it up so that the initial state of all text boxes are hidden. When the learner selects a hotspot, the related text box appears. When the learner moves to the next hotspot, the previous hotspot text is hidden; therefore, only 1 hotspot text shows at any one time.

However, if the learner goes back to a previously selected hotspot to review the text again, the last text box remains open which then results in overlays of text boxes.

How can I have the user select any hotspot in any order at any time and the only content that shows is the related text box for that hotspot.

1 Reply

Judy Nollet
Hero

3 months ago03/04/24 at 1:47 pm (UTC)

The simplest solution: Use transparent shapes instead of hotspots.

Create the shapes, and give them a solid fill with transparency set to 100%.

Give each shape a Selected state.
Enter the appropriate text in the Selected states.
Put all of the shapes into a button set (https://community.articulate.com/series/articulate-storyline-360/articles/articulate-storyline-360-user-guide-how-to-work-with-button-sets )

When objects with a Normal state and a Selected state are in a button set, clicking one automatically changes that object to Selected and automatically deselects the other objects in the button set. In other words, it works like the radio buttons in a Multiple Choice question. No triggers needed.