Any element in your animated Xplain can also perform an action when the user clicks or taps on it, and have other actions associated with. You assign links to objects with the tool. You can use this to allow the user to control the animation, to open web pages and to perform other actions.
Any element in a slide can have link and mouse actions
Chaining multiple HelpXplain animations
You can use the web page link option to chain multiple Xplains. This can help you to avoid creating excessively large single-page infographics that would overload web browsers on some users' systems. Just create a web link to the next Xplain in your last slide, or in any slide where you want to move to a different infographic.
Object scripts for advanced users and developers
In addition to regular click actions you can also assign your own scripts to be executed when the user interacts with an element. See Object Scripts for details in the Developers chapter.
1.Select the element you want to make a clickable.
2.Open the section in the pane on the right.
3.Select the action to be performed.
|
Remove any link that has previously been added in the editor
|
|
Clicking or tapping on the object animates to the selected slide.
|
|
Open another web page, either in a new tab or replacing the current page containing the HelpXplain animation.
You can use this option to "chain" multiple Xplains.
|
|
You can select from a number of HelpXplain operations to be performed, or enter your own JavaScript code here. See Object Scripts for some additional background and documentation.
The stop() and play() script methods
The xplain.stop() and xplain.play() script methods can just be selected directly to stop or restart the current animation from the beginning.
The animateTo(), animateFromTo() and set() methods
The xplain.animateTo(), xplain.animateFromTo() and xplain.set() methods need to be configured and are intended for advanced users, along with HelpXplain's Custom Scripts feature.
Media related methods
The xplain.playmedia(), xplain.enableaudio()methods start/pause/stop individual audio objects and mute/unmute audio, respectively. For details, see: Custom Scripts
Entering your own script
This capability is also intended for advanced users. Any JavaScript you enter will be executed here directly. Everything must be entered on a single line without line breaks or carriage returns.
|
|
1.Select the element you want to edit.
2.Open the section in the pane on the right.
3.Select the action to be performed in the When mouse is over object list.
|
Remove any action that has previously been added in the editor
|
|
The element will expand slightly on mouseover
|
|
Disable the object's transparency on mouseover. Only works for elements with transparency assigned in the section of the Properties pane.
|
|
You can also add your own HTML class names and custom data attributes to any element in your Xplain.
1.Select the element you want to edit.
2.Open the section in the pane on the right.
3.Enter the class or classes and any data attributes.
HTML class names:
If you want to add more than one HTML class name to the element separate them by single spaces.
Data attributes:
Enter the attribute name in the left column and the data in the right column. For example, if you enter an attribute called data-imageno with a value of image1 to an image element, the attribute will be added to the image tag like this:
<img src="holycow.jpg" data-imageno="image1" />
|