New Revised CSS Library Forums Web Tools
FAQs Awards Usage Terms Contact
Categories
Other Sections
Sweet Ads
Compatibility
Bookmark online:


FF1+ IE5+ Opr7+

Fixed Tooltip script

Author: Dynamic Drive

Description: Looking for a tooltip script where the tooltip is anchored to the link's position rather than following the mouse around? Fixed Tooltip script behaves in just this manner, unlike Cool DHTML Tooltip I or II. Whichever way you like it, we got you covered now!

Demo (move your mouse over):

JavaScript Kit | CodingForums.com


Directions: Developer's View

Step 1: Insert the following stylesheet into the <head> section of your page:

Select All

Step 2: Insert the below code into the <body> section of your page:

Select All

Step 3: As shown in the code of Step 2, for links that will carry a tooltip, they look like:

<a href="http://www.javascriptkit.com" onMouseover="fixedtooltip('Comprehensive JavaScript tutorials and over 400+ <b>free</b> scripts.', this, event, '150px')" onMouseout="delayhidetip()">JavaScript Kit</a>

where the first parameter of "fixedtooltip()" is the tooltip text, and the final parameter ("150px"), an optional string you pass in to modify this particular tooltip's width, if different from the default tooltip width. Enter a blank string instead ("") if the tooltip width will be the same as the default width specified in the global variable near the top of the script.