Animations not Working
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
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:
That should make things look more smooth. Let me know how this works for you and if you have any questions.
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:
That should make things look more smooth. Let me know how this works for you and if you have any questions.
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
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
Do you mean that events on one element weren't triggering because there was an element above it?
Do you mean that events on one element weren't triggering because there was an element above it?
Replies have been locked on this page!