Tooltip

The Tooltip property allows you to showcase additional information when the user moves the mouse pointer over an element.

Add

• Open the Advanced tab.

• Open the Tooltip tab.

• Set up as required.

Make sure the Tooltip is active before setting anything.

Active

• Select a block.

• Open the Advanced tab.

• Open the Tooltip tab.

• Toggle on.

Source

The Source property allows you choose whether the Tooltip content source will be static or dynamic.

pageSource

Placement

Allows you to choose where the Tooltip is placed (top, bottom, left...)

Add

1. Select a block

2. Open the Block Inspector

3. Navigate to the Advanced tab

4. Select the Tooltip tab

5. Find the Placement property

6. Click on the desired type options (fade, scale, puff, flicker)​​

Theme

Allows you to choose your Tooltip's theme, which means the way it looks.

Animation

Allows you to set the entrance/exit of the Tooltip. (Fade, scale, shift away...)

Follow

Allows you to choose whether or not your Tooltip follows the user's mouse.

Duration

Allows you to set a Transition Duration, helping to make its entrance/exit more or less smooth.

Add

1. Select a block

2. Open the Block Inspector

3. Navigate to the Advanced tab

4. Select the Tooltip tab

5. Find the Duration property

6. Enter the desired duration

Delay

Allows you to set a Delay for your Tooltip's entrance/exit.

Add

1. Select a block

2. Open the Block Inspector

3. Navigate to the Advanced tab

4. Select the Tooltip tab

5. Find the Delay property

6. Enter the desired delay

Arrow

Allows you to set an arrow.

Activate/Deactivate

1. Select a block

2. Open the Block Inspector

3. Navigate to the Advanced tab

4. Select the Tooltip tab

5. Find the Arrow property

6. Toggle the button on/off

Hide On Click

Allows you to hide the Tooltip, once the user has clicked.

Activate/Deactivate

1. Select a block

2. Open the Block Inspector

3. Navigate to the Advanced tab

4. Select the Tooltip tab

5. Find the Hide On Click property

6. Toggle the button on/off