Tooltip

The Tooltip control displays an informative message on other controls. It is commonly used to displays helpful tips for input controls.

Like almost all SPARK controls, you can trigger events that are fired when the user interacts with the control (see the Event and Methods sections below and the Event Handling article for more information).

This control is most commonly used to provide users with helpful tips.

Appearance

Show Label The visibility of the label

Label Placement Top, Left

Width Define the width of the Tooltip box in px or %.

Color Style

Horizontal Position Left, Center, Right

Vertical Position Top, Bottom

Behavior

Show Tooltip Visibility of the tooltip

Show on Hover The visibility when user hovers over the tooltip

Text as HTML If you want to style the tooltip text, <b> </b> to bold for example, this is done in the Help text box under General

Example

These are the configuration option settings...

This is the result...

Note:  There is a Text control inside the Tooltip control that has the placeholder text of 'Write something here...'

The tooltip control is a container control, at runtime, the Tooltip wraps itself around the nested control.

Events

With the Tooltip control, there are 2 types of event handlers:

• On Load When the page loads
• On Click When the tooltip is clicked

You can use JavaScript logic to affect the effects of the control, depending on the event. More information on using these controls can be found in the Event Handling article.

Methods

For detailed information on the available methods for this control, access the JS Doc file.

 

• Authors: Elliot Pytosky, Courtney Silva
• Date Created: June 8, 2015
• Date Modified: October 30, 2015