Actions & Animations Overview
Options to give your page interactivity.
The Actions menu in Readz allows you to add things like links, animations, and other interactivity to elements and to your page. The actions menu is represented by this highlighted icon in the page menu and the element menus.
To create an action, you first need to specify where it will occur. You can choose between having it occur on the page as a whole, or on a specific element. Then you will need to specify when it will happen.
Styling version (click here to learn more)
This option gives you the choice to apply any of these action or animations settings to this same element on the other devices. You have the flexibility with Readz to have this element perform the same action or animation on one device, and a different action or animation on the other device. You can of course also choose to keep them the same across all devices if you have the styling version set to “all”. For each element, you’ll find this styling version on font properties, element properties for all elements, and actions. For the page menu, you’ll find this styling version for the background style options and the page action menu. More about styling version here.
For element actions, you have several options for choosing when the action will occur. They are known as "triggers". The type of trigger can vary. For page menu actions and animations, the trigger can be when the page loads, or when the mouse-cursor leaves the area of the webpage. For element actions, the trigger can be the element that has the action or animation on it, or it can be another element, that interacted with, makes another element animate. We'll explain further through examples of when to use triggers.
Note that some of these triggers are for specific devices only.
● ON CLICK: the action will occur when a visitor clicks (desktop) or taps (tablet and mobile) on the element ● ON HOVER OVER: this is for desktop only. When the mouse cursor hovers over the area of the element that has the action, the action will be performed ● ON HOVER AWAY: this is for desktop only. The action will occur when a visitor’s mouse leaves the area of the element with the action ● ON ELEMENT DISPLAY: the action will occur when the element appears on screen. In other words, when the element becomes visible to the visitor as he or she scrolls through the page ● ON ELEMENT HIDE: the action will start when the visitor can no longer see the element after scrolling away from it.
The editor now has a play and reload button that allows you to preview your actions right in the editor, so there is no need to go back and forth between the editor and preview link. The gif below shows how clicking the reload button lets you see how the page will look when a visitor visits your site. The keyboard shortcut for playing and pausing the actions is ALT+P.
Testing your Actions
How to create animations or actions (click one below)
Triggers (click here to learn more)
Back to Menu
DELIVER BETTER CONTENT EXPERIENCES
DELIVER BETTER EXPERIENCES
DESIGN THE WAY YOUR BUSINESS GROWS
Powerful, intuitive content creation software for marketers and designers.
TRUSTED BY SOME OF THE WORLD’S SMARTEST COMPANIES