Textured button with active state?

1

Hey guys,
I created a navigation bar for a prototype. For this purpose I used a textured button with a background-image.
Is there a way to define an active-state? I planned to overwrite the “normal” state for each textured-button in case its active, but I am not sure if there is a better way to do this.

Cheers!

2

Hi oliver!

Have You tried the “Show Button Controls” ?

If not see if the following works for You:

  1. Select one of your buttons.
  2. Go to the “Edit” menu > “Show Button Controls”.
  3. A 3-state control “Normal”, “Hover” & “Pressed” will appear over your button.
  4. The “Pressed” state = “Active”.

When one of these states is selected, make the desired changes to the button’s settings~properties.

3

Hello Jim, this is not working.
How should the button know, that the current scene is his “active/pressed” state?

link-problem.zip (41.0 KB)

4

Do you mean ":visited". The "active" state ("pressed" in Hype) happens when the actual click is made it changes back to "normal" or to a :visited pseudo selector if defined in CSS.

If you wanted the "visited" state then you would have to define it in your Head HTML in style tags.

5

You could just have the "hover" / "active" state as the normal state for the button that corresponds to that scene when in the selected scene. So when navigating to that scene the button will stay in that state.

6

That’s what I did. If I had had the opportunity to set a active-state (“The link’s page is opened at the moment”), I would have prefered to use that since I would be able to create a symbol out of it.

7

Be careful with your wording. An "Active state" in CSS means something different. I think you mean when an element is selected to stay in a particular "state". Give me a few mins and I'll share with you a technique you can use with a timeline.

8

Hey Dbear, I must have misrembered this CSS-tag, also I’m not a native english speaker. Sorry!
I thought that active is used (in wordpress/joomla templates) for that kind of stuff …

9

no probs. As promised. Here is a possible solution using relative timelines in Hype.

menuSelected.zip (51.2 KB)

2 Likes
10

Thank you this is working!

Just a little info for all the beginners like me finding this approach interesting. You need to add a mouse out event to this animation.

1 Like