Home > How To > How to Add Multiple Tooltips to an Image

How to Add Multiple Tooltips to an Image

The ability to add multiple tooltips to an image directly supported in HelpConsole but it can be accomplished by doing the following: 

1. Add an image to the page using the 'image manager' 
2. Right click on the image and select "Image Map Editor" 
3. Click 'Create New Area' and position the area box where you want it 
4. Clear the 'URL' value 
5. Enter a value for 'Alt Text’ 
5. Click OK 
6. switch to html view (click HTML icon at bottom of editor) 
7. Add a title attribute to the areas that you want to display a popup message 

<area shape="RECT" coords="8,22,28,42" alt="Email Me" title="Email Me" /> 

Applies to: HelpConsole 2010

 Anonymous said:
I really want to do this, but is there a way to use the tooltip function? I found a code to allow a tooltip to appear over a section of text as below:

BUT could you apply this to a hotspot?

2/19/2014 1:28:45 AM
 Anonymous said:
It didn't show the code in the last message. I will try again:

style type="text/css">
a.tooltip {
position: relative;
text-decoration: none;
color: blue;

a.tooltip span {
display: none;

a.tooltip:hover span {
position: absolute;
top: 40px;
left: 0px;
display: block;
width: 250px;
color: black;
background-color: #FFFF40;
border: 1px solid black;
padding: 5px;
2/19/2014 1:29:44 AM

Article ID:
Views: 2127
Created By: admin
Modified By: admin
Created Date: 5/1/2013 3:15 PM
Last Modified: 5/1/2013 3:15 PM
Print This Article
Email This Article
Previous Article
Next Article

Was this page helpful?YesNo