Dynamic Drive DHTML code library!
Dynamicdrive.com


.
spacer.gif (807 bytes)
.

Menu

Search DD
Recommend DD
Help Forums New
DHTML books
Advertising
Contact

Featured Script
Rollover buttons 

Turn regular form buttons into rollover menus with this script!
.

Partners

Free JavaScripts
.

Link to DD

Do you use scripts from Dynamic Drive? Please give something back by linking to us...
.
spacer.gif (807 bytes)

Home Small4.gif (1046 bytes) Links and buttons Small4.gif (1046 bytes) Here

Popup information box II All

Credits:
Name:
Mike McGrath
Website: Homepage
Note: Deprecated script. See Cool DHTML Tooltip for new script.

Description: Use these colorful popups to provide additional information about any link, inline and non intrusively as the mouse moves over the link. Cool, we say!

Demo:

-JavaScript Kit

-Freewarejava.com

-Flaming Text

-CodingForums.com


Directions: Developer's View

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


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


Step 3: Finally, add the following inside any link that will contain a popup:

ONMOUSEOVER="popup('Link description here','yellow')"; ONMOUSEOUT="kill()"

where the first parameter inside popup() dictates the text to be displayed, and the second, the color of the box itself. Here are a couple of examples:

<a href="http://wsabstract.com" ONMOUSEOVER="popup('Website Abstraction, the definitive JavaScript site on the net.','lightgreen')"; ONMOUSEOUT="kill()">Website Abstraction</a>

<a href="http://webmonkey.com" ONMOUSEOVER="popup('Tutorials and tips for the advanced webmaster','lightgreen')"; ONMOUSEOUT="kill()">WebMonkey</a>

Enjoy!

Recommend Us!
-If you like Dynamic Drive, please recommend us to a friend...

Legend
All- Script works with Netscape 4 AND Internet Explorer 4+
NS- Indicates script works with Netscape 4 (NOT NS 6 yet)
IE- Indicates script works with Internet Explorer 4 and above
NS6!- Temporary index set up on script category pages to indicate script works in NS6


Copyright 1998-2004 Dynamic Drive. Please read Terms Of Use here before using any of the scripts.
Partners: JavaScript Tutorials | JavaScript Reference