In a nutshell, my hover states are trumping my selected states on 5 of the six options. This means when the mouse is hovered over a selection (before, during, or after it is selected), it shows the hover state. I want the selected state to show the moment it is clicked and not be affected by the mouse unless it is de-selected. What am I doing wrong and how can I fix it?
You're not doing anything wrong. You're just witnessing how a Hover state works. It will always show on rollover, because that's what it's built to do.
One fix:
Create a custom state that lookslike your Hover state but that isn't called "Hover." (In other words, you don't want the object to have a built-in Hover state.) For this example, let's call it HoverLike.
Create a T/F variable with a default value of False. For this example, let's call it HoveringOff.
Add a trigger that changes the object's state to HoverLike on mouseover with the condition that HoveringOff = False. Like this:
Add a trigger to the object that toggles the value of HoveringOff when the user clicks the object. That'll make the variable True when selected and False when deselected.
Note that the user will still need to move the mouse away from the object after clicking it to let the object make the change to Selected. That's because the custom hover is still in effect when the user clicks. Again, that's just how things work. (And it's one reason I don't like Hover states.)
Hi Judy, I completely agree with everything you've said - it is quite a lot of effort to create variables for all of these options for the 15+ questions I have in my project. I like your solution if nothing else works, but I don't want to drown by manually inputting all of those triggers and variables for every choice for every question, so I'm hoping there's a simpler answer out there.
I just don't understand why they aren't all working the same, even when I tried duplicating the one that does work. The first option choice works like I want it to (the selected state overrules hover) while the rest of the options don't.
Interesting development: I edited the hover state of the yellow circle for the choice that IS working: I deliberately selected Shape Fill > No Fill (not sure what it was before). I thought this would reinforce seeing right through the hover to the yellow selected state, but much to my surprise, it turned it into the same function as all the others: the circle is gray on hover even when selected. Scratching my head over here.
SOLVED: I can't believe I didn't see the obvious solution. There's no need for the circles to have hover states that are identical to the normal states. I removed the hover states entirely and everything works great.
UNSOLVED: It remains a mystery why the first answer choice functioned differently than the rest at the time of posting that video. After removing the hover states on the circles, everything works fine, but I have no answer for why answer choices behaved differently despite having all the same settings.
Alas, there are some mysteries that may never be solved...
FYI: I typically avoid Hover states. When they do look different, they can be confusing. Example: when they overshadow a Selected state because the user clicks but doesn't move their mouse away from the object. And if the Hover state looks the same as Normal, well, there's simply no need to waste space keeping it.
4 Replies
Hi, Robbie,
You're not doing anything wrong. You're just witnessing how a Hover state works. It will always show on rollover, because that's what it's built to do.
One fix:
Note that the user will still need to move the mouse away from the object after clicking it to let the object make the change to Selected. That's because the custom hover is still in effect when the user clicks. Again, that's just how things work. (And it's one reason I don't like Hover states.)
Hi Judy, I completely agree with everything you've said - it is quite a lot of effort to create variables for all of these options for the 15+ questions I have in my project. I like your solution if nothing else works, but I don't want to drown by manually inputting all of those triggers and variables for every choice for every question, so I'm hoping there's a simpler answer out there.
I just don't understand why they aren't all working the same, even when I tried duplicating the one that does work. The first option choice works like I want it to (the selected state overrules hover) while the rest of the options don't.
Interesting development: I edited the hover state of the yellow circle for the choice that IS working: I deliberately selected Shape Fill > No Fill (not sure what it was before). I thought this would reinforce seeing right through the hover to the yellow selected state, but much to my surprise, it turned it into the same function as all the others: the circle is gray on hover even when selected. Scratching my head over here.
SOLVED: I can't believe I didn't see the obvious solution. There's no need for the circles to have hover states that are identical to the normal states. I removed the hover states entirely and everything works great.
UNSOLVED: It remains a mystery why the first answer choice functioned differently than the rest at the time of posting that video. After removing the hover states on the circles, everything works fine, but I have no answer for why answer choices behaved differently despite having all the same settings.
Alas, there are some mysteries that may never be solved...
FYI: I typically avoid Hover states. When they do look different, they can be confusing. Example: when they overshadow a Selected state because the user clicks but doesn't move their mouse away from the object. And if the Hover state looks the same as Normal, well, there's simply no need to waste space keeping it.