INSTRUCTIONS
Copy and paste the following style declaration in the HEAD section of your page, then edit the style attributes to suit:
Select all...
Copy and paste the following script in the HEAD section of your page:
Select all...
Copy and paste the following HTML in the BODY section of your page:
Select all...
Lastly add the mouseover/mouseout event handlers to each link that you want this effect for. Example:
<a href="http://scriptasylum.com" onmouseover="writetxt('Visit my website')" onmouseout="writetxt(0)">Link text</a>
There are 4 flags in the js file you can set to control the way the script behaves. Just edit the js file to change them:
- mousefollow - Enables mouse follow mode where the box continues to follow the mouse. Setting to false will cause the box to appear near the mouse but will not continue to follow the mouse.
- fadein - Set to true to enable the fade in effect, set to false to disable it. This feature only works in ie4+ and ns6+.
- xoffset - Sets the horizontal pixel offset from the mouse. Fine-tune this value to get the best result.
- yoffset - Same as above, but sets the vertical offset from the mouse.
- centertext - Set to true to center the text in the box, set to false to left-justify the text. This normally could simply be changed with the style definition but Netscape4.x has problems with this, so....
NOTE: You can cause a box not to disappear once the mouse leaves the link by simply omitting the onmouseout="writetxt(0)" part.
This will cause the current box to remain visible. This is best used when "mousefollow" mode is disabled (set to false).
Otherwise, the onmouseout="writetxt(0)" is required to cancel the box when it leaves the link.
|