Hover States with symbols

(Gregor) #1

First let me apologise if this question was already answered on this forum but I really couldn’t find any appropriate answer for my problem.

I used to use Adobe Edge Animate for HTML5 animations. I recently switched to Hype 3 and I really enjoy working with it.
I only have one problem with symbols. As I understand symbols are elements that have separate timelines. Within the main timeline you are then able to play/pause/stop the symbol. Using that I want to make a button with animated transitions between states; onMouse Over - Start symbol timeline, onMouse Down - Start symbol timeline in reverse.
For some reason that does not work. What I noticed is that Symbol’s animation autostart with loading a scene. Is there a way to not autoplay Symbol’s timeline? Or is there any better way to make animated button in hyper 3.

Thank you for your answers.


I do not know the reason for using symbols but I guess there must be. Personally, what you are asking can just be accomplished by using timelines with in the Hype document. But, as you have mentioned you wanted to use a symbol then the following may be useful.

Whenever you create a symbol Hype automatically creates a “symbol action”

that plays the main timeline of the symbol. If you look in the main timeline of the Hype document you will see it. You just have to delete it to stop the symbol from playing automatically.

That being said you could just create a timeline in the main doc and attach it to the mouse over and mouse down actions in the inspector. No need for a symbol.

(Gregor) #3

Thanks for your answer.
However that wasn’t the cause. I had a look at a symbol again and I figured out that the parent timeline of a symbol should be specified within the symbol. Basically I didn’t know that the symbol can have different timelines depending on which timeline the symbol appears on.


I don’t think you understand what symbols are :slight_smile: Symbols are like having a Hype document within a Hype document. You can have multiple instances of a symbol so you could potentially have the same animation in different areas of the Hype scene. This is useful if you wanted to have a specific animation “repeated” all over your scene. Frankly, there are many ways you can use symbols and 2 different types to choose from. I think if you want a specific response to your problem it would be better to share it here in the forum. (zip (compress) it up and drag it into the message area) otherwise we are just guessing as to what you are doing.

What you replied with doesn’t make sense. There are no “parent” timelines. Symbols have there own timelines separate to the scene’s timelines. You can use the symbols property to call actions on the symbols timeline and also call them using the Javascript API and even using custom behaviours.