Hover vs. Click State Changes


(Arjun Mahesh) #1

Hi Folks at Tumult,

I was wondering if you could help me out with an issue I was having. I have some hover states set up so that when I hover over a certain header link, the background will change color. If I stop hovering over this link, the background will return to its original previous color.

However, I am having issue when clicking the link. When I click the link, I want the background to remain the color it was in the hover state. However, the hover out functionality will then activate after the click, and the background color gets messed up.

Example:
The base color is magenta. When you hover over the I’About’ link the background turns green. When you hover off it returns to magenta. However, When I click ‘About’, I want the background color to remain green and now the new base color is green.

Any help greatly appreciated!


(Jonathan Deutsch) #2

You’ll want to separate the animations of changing the background color and the hover-over effect for the navigation item.
So you’ll wind up with timelines for just the background changes. Then your action on the navigation items would chain together starting timelines for both timelines for mouse over, and on mouse out you would only start the element one in reverse, but not the background timeline.

The next step is in the Scene Inspector, you’ll want to change the background timelines to use relative keyframes. This means that it will change from the color it is at to the new color.

The final (and optional?) step is that you can add a on mouse out action on the main containing group to run a timeline to turn the color back to the default state, if you didn’t want it to stay that way. (I assume this would be the one for Home, but otherwise you could create a new timeline with relative keyframes again).