text rollover

Aug 04, 2013

(I have a feeling this question & its answer exist somewhere in this forum, but, my search for it has been unlucky.)

We want to provide rollover text definitions.

For now I've created a hotspot that goes to another layer. I can't use a marker because it gets in the way of other text on the screen. I very much prefer the marker model to showing another layer for a definition.

Is there a better way to create text rollovers?

35 Replies
Walt Hamilton

The  if - then function has to be created manually, using a series of triggers with conditions. Be sure you plan carefully, because:

1. a series of triggers attached to a certain action on a certain object is evaluated in the order they appear in the trigger list.

2. unless the execution of the list is interrupted by a jump to another slide, ALL triggers are executed, even if a prior one has a true condition. That means each of them needs to have a completely exclusive set of conditions.

3. AND cannot be mixed with OR in the conditions. Multiple conditions must all be joined by either all ANDs or all ORs.

Walt Hamilton

To answer your question: When you create a built-in state (normal, visited, hover, selected, down, etc.) it automatically has the necessary triggers to work correctly. If you also write triggers to perform those actions, there will be conflict, and the results are frequently not pleasing. I erased all the triggers on the layer, and it works perfectly.

If I may make a couple of suggestions.

On the base layer, I edited the Ingredients & Serviceware tab to remove the text boxes, and place the text directly on the rectangle. (right click and choose Edit Text). Your set-up seems to be working, but triggers and states are always more reliable when there is only one object involved. Using a rectangle with text is almost always superior to using a rectangle and two text boxes.

The layer works perfectly, but I wonder about the design. you ask the user to click, and they need to click to see the tick mark, but if they hover over, they receive all the information, which removes the motivation to click. If they revisit the layer, the evidence that they have seen everything is missing. I would recommend one action to get both the tick and information.

If you want to use the click, merely delete the hover state.

If you want to use the hover, you will need to create a new state that is not one of the built-in states. Duplicate the visited state, and call it something like Completed, or viewed. Add a trigger:Change state of ingredient list to Completed when mouse hovers over, and untick Restore on Mouse leave.

One final suggestion. When you hover over In-House Service ware, move the mouse slowly to the bottom of the text. As you leave the textbox, you will see the content flash. This is caused by the size of the text box in the hover state being smaller that it is in the normal state. As the mouse leaves the bottom, normal state is restored. When it is, the mouse is now within the larger box, and it changes to hover state. Now the mouse is outside the smaller box, and it restores the normal state, etc. This is because the font in the hover state is smaller, so the text box is smaller. For the ingredient List, I resized the text, and it doesn't have this problem.

Walt Hamilton

Probably not in a manner that will keep you happy. The hover and visited states are less than compatible. You will have to decide on some trade-offs.

In the sample, on Slide 1.1 I  copied the yellow graphic and text from the hover state to the visited state. Now when the user clicks, the state persists. The problem is that the Packaging button is on top of the other two, and Ingredients is under the other two. If  Packaging or In-house is clicked, then the ones below it don't show up whether they are rolled over, or clicked on. It only works the way I think you want it to when Ingredients is clicked.

So on slide 1.2, I copied the visited state to another built-in state named Selected, and made the three buttons to a button set, so only one of them can be selected. It works better, but maybe still not the best. If Ingredients is selected, the hover works. If In-house is selected, the hover works only for Packaging, and if Packaging is selected, no hovers work.

I think I prefer slide 1.3, where the hovers are removed and only the clicks function. You have to decide which you prefer, but I think you will have to make some tradeoffs. I don't think you can have everything you want. The technical explanation is that the buttons cannot occupy the same level, they must be stacked. There must be a z-order to the objects. If one has a persistent state, then the hover states of the ones lower that it will not show.  You could set the layer to return to its initial state when revisited. Then if it is revisited, everything would start over, but there is still the problem of the higher persistent state obscuring the lower hover states.

So I guess: choose which option you dislike the least.

Indrani Sen

Thanks again, Walt. I think I am leaning towards the 'selected', and accepting that 3 checks will not be visible even after the user completes visiting the 3 checks. I was able to do similar interactiions in Flash, and also with a message 'you have completed'.

However I am so so appreciative of all your helpful. This is super customer support. Yu and your team is the best !


Walt Hamilton

Do you mean it appears too rapidly? You can build a text box, give it an animation, copy it, edit the states, and paste it on the hover state.

Otherwise, states are binary, meaning if you have a hover state, and the user hovers, hover state is visible. When the mouse leaves, the hover state disappears. It's either/or, there is no halfway.

This discussion is closed. You can start a new discussion or contact Articulate Support.