I require a customised tooltip box, which I would like to implement on my webpage to allow users to get more info/help on a topic.
The tooltip box should open as a pop-up when someone clicks on a specified image and remain in a fixed position until the users closes the box (by clicking on the “x”)
Ebay has something like this in operation when inserting a product for sale and clicking on the “?” (Questionmark) behind the topics.
The tooltip function should not be embedded directly in the html, but should be a standalone javascript-file.
As there are different help texts for different subjects, a second javascript file has to be created which will contain the different text-ids and their content. The texts contained in that additional javascript file will be html-formatted.
The size of the textbox should always adapt automatically depending on the length and format of the text.
The programming hence consists of the images for the tooltip box, the javascript-function-file, and the javascript-textcontent-file.
For the design of the tooltip box please see the attached jpg-file.
The textbox should work perfectly under IE, Firefox, NS and Opera. The textbox should not be affected by any pop-up blocker.
The code should be kept as small as possible to ensure speedy page loading times.