Animations not Working

Chris shared this problem 7 months ago
In Progress

Hello,


I have several animations that have stopped working on one of my prototype pages. They sometimes work intermittently but seem to be getting worse.


The animations appear to look fine when I review in the Events pane. These are mostly drop down menus that no longer drop down when I press the arrow.


What is the best way to troubleshoot this? I have components grouped and they were working fine previously.


Here is the page: https://www.justinmind.com/usernote/prototypes/42371571/45745260/45745262/index.html#/screens/a21a4531-e0bb-4f81-a722-ca812962ab9c.


Chris

Comments (6)

photo
1

They look to be dropping down correctly. However, we noticed that the dropdown doesn't go up after clicking the arrow again. We can create a simple condition and add 2 additional actions to fix this:

1. On the existing events, click the 'add condition' text. In the Conditional Expression builder, drag the dropdown options group into the open space, and in the dropdown that appears, select the 'is visible' option. Then, drag the 'NOT' function in front of it, and click 'OK'. This condition will check to see if the dropdown options aren't already visible, and will trigger the two actions in the event if the condition is true.

2. Click the 'Else' text and create an "On Click" + "Hide" event, hiding the dropdown options group with easing/effects. Then, right-click on that action and select 'add action after selected'. In the Event builder, leave the trigger as "On Click", but change the action to "Rotate", and choose the arrow to rotate 180° offset with some easing. There's no need to create a condition for these actions.

This is how the events should look:

78136122aed2c53a5ed24d75d252b954

That should make things look more smooth. Let me know how this works for you and if you have any questions.

photo
1

Hi Danielle,

Thanks for the response.

I was able to solve the problem of features not working. This was due to the "layering" of the components in the prototype and for each item I had to "bring to front" starting from the items at the bottom of the screen and working upwards. I was surprised that this transferred to the working prototype. Is that intentional?


Thanks for the tips on closing the menu. I had left this out to get the prototype online for review much quicker but it certainly cleans things up!


Chris

photo
1

Do you mean that events on one element weren't triggering because there was an element above it?

photo
1

Yes, exactly.

photo
1

Not sure if this is the same person as the question creator, but in that case then moving the elements to the top of the outline or marking them as always on top in the Properties palette would fix that. If they're premade drop downs that were included in a widget library they should be on top by default.

photo
1

Yes - this is basically what I did, though I was surprised that the layering still applied in the actual operation of the prototype.

I tried to adjust the drop downs to close with the button as well but couldn't get it to work. That said, it has been hard to focus these days so I may just not have gone through these steps carefully enough!

photo