Adding actions, animations and effects
Actions can be used to accomplish a range of things that are based on a trigger event (e.g., "touch/click" or "page visible") which defines what a range of actions should be executed (e.g., "animate content", "show/hide an element", "navigate" to a different page, etc.).
1. Select the element that the user has to interact with to trigger the action.Open the actions pallete on the top right.There are 3 things you need to define:
- Select the element on which the action will be executed.
- Then select the event that will trigger the action.
- Finally select the action that you want to occur.
For instance, we can make the top text fade out if the user clicks the bottom text. To do this you select the bottom text, open the action pallete, select the top text as the target, select click as the trigger and select animations > fade out as the animation.Don't forget to save your settings and click add action when you're done.
2. You can optionally provide a name for your action to keep them organized.
3. You can remove an action by clicking the 3 dots . There you have the option to delete or duplicate an action.
Editing an existing action can be done by selecting it, and its settings will be loaded up into the pallete above. Resaving it will overwrite the old action settings with your changes.
- Animation actions will set their own initial state if the trigger isn't click. For example, a fade-in action with a trigger of page load, will make the element invisible before the page loads, so the fade-in effect is visible. This isn't possible for click actions, since multiple actions could have contradicting initial states.
- Actions can be used to navigate to a different page when clicking a certain element.