Custom Hover state with trigger not functioning

Oct 14, 2016

I have a custom hover state which is comprised of a shape with a picture for the background. In addition, I have applied a SPIN entrance and exit animation to this state. Now I do not want the custom hover state to appear once the user has clicked on the button but I do want the user the ability to access this button again should they choose(so no disable state). I have used a trigger which states to show the custom hover when mouse hovers over Button1 on condition that Button1 state is Normal. The problem is that it only shows on first mouse hover with no click. Any ideas? Thanks for any advice!!!

6 Replies
Leslie McKerchie

Hi Karen!

Trying to follow along here. Once an item is clicked it is probably in a visited state by default, which means your trigger would no longer be relevant, correct - since it's dependent on the 'Normal' state? You could add additional triggers perhaps.

If you need us to take a look at your .story file, please feel free to share so that we can better understand.

Gibson 68

Hi Leslie,

Thank you for your quick response. I am attaching the file here. Maybe I can explain a bit better too what it is I am trying to achieve.

There are a total of 18 buttons. Each when clicked will show a layer specific to that button. I currently have 3 button states for each: 1. Normal 2. Custom Hover 3. Completed

What I would like to happen is that the user should be able to revisit each button content after viewing initial time. However, I do not want the hover/animated state to reappear when they select the button for a second time. Currently only Button1 has the all of the states for troubleshooting purposes. Thanks again for any information you can provide.

 

Walt Hamilton

Karen,

A couple of things going on here:

1. Having two triggers to do the same thing will most likely cause conflicts:

  

I  would delete the first and keep the second, because several states seem to satisfy the "is normal" condition.

2. The hover only works once, because when the mouse moves over the button, it goes into hover state, and stays there. Edit the trigger and select the option to "Restore on mouse leave".

Which will introduce another problem: when the mouse leaves and the state is restored, it overrides the completed state.

Check the attached sample, where everything seems to work. I put an invisible shape on the button, so it doesn't respond to the hover when the user returns. In the sample, I set its transparency to 90%, so you can find it, but if you change it to 100%, it will disappear. Note that it has to cover the entire rectangle of the bottle cap, or it won't work.