Buttons don't work consistently on timelines

Not sure what I did wrong here but I seem to get inconsistent success. My nav defaults to the first section (orange). Every nav button goes to a new timeline to load that content. I feel like I can click top to bottom in the nav order and everything works, but if I go out of order or try to go more than once to each section the buttons stop working. Hope this is an easy fix, any help ASAP :slight_smile: would be appreciated.
https://davisandco.box.com/s/k0prif9cb8ieb98y7dw0ywp80iqrn1eu

That link didn’t work – can you upload an example to the forums?

Oh sorry about that. Here you go.

DCO_ChangeComm_Infographic-v7a.zip (2.3 MB)

When you load a timeline like ‘One Orange’ its elements are at the bottom of the layer order. So if you then load ‘Two lt blue’ then its elements are placed on top of it. If you load ‘One Orange’ after ‘Two LT Blue’, then the Orange timeline will show elements underneath the One Orange elements.

The workaround for this is to reset each timeline to 0 when clicking a new nav item.

hypeDocument.goToTimeInTimelineNamed(0, 'FOUR GRAY');
hypeDocument.goToTimeInTimelineNamed(0, 'THREE GREEN');

…etc.

But if I start each new timeline at 0, do I then move all of the elements that start at 12 to zero? And how does that differ then if they all are changed that way, then they stack the same way there?

Not sure if I did this correctly, Im guessing I did not because I still get inconsistency.
DCO_ChangeComm_Infographic-v7b.zip (407.5 KB)

You essentially want to make sure that your elements don't hide other elements. If you play a timeline to 20 seconds and then play another timeline (which has elements underneath it), those elements won't appear. So you need to make sure each timeline is set back to its starting point. If there's a different # of seconds that is better like 12, then you can set it to that.