First time posting. I’ve used Hype for a while. I do NOT know JS, and don’t really want to, but understand the super duper basics of what it is. I’m hoping I do not need to know it for what I’m trying to do here.
In this document, I’m trying to build a persistent symbol as a navigation tool to jump to all the scenes in my document. The persistent symbol is made up of other symbols that represent page icons for each of the scenes in the document.
The easy part is done… the symbol is in place, and it is draggable on the x axis only. I found some JS that achieves that from another post (thank you!!). I don’t understand it, but understand it works, lol.
The document will be ever changing with a varying amount of scenes, maybe 10, sometimes 50, sometimes 100.
So when you select the first thumbnail in the symbol, an animation makes that thumb bigger and takes you to page 1. Selecting thumb 2 will enlarge the second thumb and take you to page 2, and so forth.
Here’s the question and it may require a quick rebuild. I’d rather not use JS at all except where absolutely necessary like the scrolling x only part, way beyond me, but you can tell I was trying to experiment with that here.
If you select page 1, icon 1 grows and you’re taken to page 1. But then say you scroll to the 15th thumbnail and select it. #15 should animate up, and then whatever other thumb is that’s currently selected (in this case thumb 1) needs to reverse animate and go back to it’s normal state. I feel like I’ve seen this solved somewhere on the forum, but can’t currently find the example. Basically when any thumbnail is selected out of however many pages, it needs to check to see if other thumbnails were previously selected and put them back to original while it enlarges.
Eventually, each of these page thumbnails will hold it’s own unique image, so they will all look differently. I figured that’s why it needs to be built this way?
Do I need to build my persistent symbol differently and maybe use custom behaviors? Again, I’d like to do it using native Hype’s capabilities so I get what’s happening.
I could just have each page icon enlarge and then go back so you know it’s selected, but it’s just not as cool. I have a working version of that, but rather would do it where each icon stays enlarged until another is selected.
I’ve only worked up to the first 2 icons and then became frustrated. Would love some input.
relative_menu.hype.zip (111.1 KB)