Dynamic Drive DHTML Scripts- Link Description script

FF1+ IE5+ Opr7+

Link Description script

Author: Dynamic Drive

Description: Bestow meaning to your text links with this script. As the mouse hovers over a link, a corresponding text description appears beneath it. You can define more than one location for which this description is shown, allowing for links all over your page to benefit from the functionality.

This script requires IE4+/NS6 to operate, degrading well with all other browsers.

Demo:

Dynamic Drive | JavaScript Kit | Freewarejava

Encarta | Britannica | Dictionary.com

Directions:

Simply add the following to the <BODY> of your page:

Select All
<script> //Link Description script- (c) Dynamic Drive (www.dynamicdrive.com) //For full source code and TOS, visit http://www.dynamicdrive.com //change link descriptions to your own. Extend as needed var linktext=new Array() linktext[0]="Visit Dynamic Drive for some great DHTML scripts!" linktext[1]="JavaScript Kit, the JavaScript technology center" linktext[2]="Direct link to hundreds of free java applets online" linktext[3]="Research information, get homework help, chat with educators" linktext[4]="The virtual encyclopedia" linktext[5]="Your online dictionary" var ns6=document.getElementById&&!document.all var ie=document.all function show_text(thetext, whichdiv){ if (ie) eval("document.all."+whichdiv).innerHTML=linktext[thetext] else if (ns6) document.getElementById(whichdiv).innerHTML=linktext[thetext] } function resetit(whichdiv){ if (ie) eval("document.all."+whichdiv).innerHTML=' ' else if (ns6) document.getElementById(whichdiv).innerHTML=' ' } </script>  <a href="http://www.dynamicdrive.com" onMouseover="show_text(0,'div1')" onMouseout="resetit('div1')">Dynamic Drive</a> | <a href="http://www.javascriptkit.com" onMouseover="show_text(1,'div1')" onMouseout="resetit('div1')">JavaScript Kit</a> | <a href="http://www.freewarejava.com" onMouseover="show_text(2,'div1')" onMouseout="resetit('div1')">Freewarejava</a> <a href="http://encarta.msn.com/" onMouseover="show_text(3,'div2')" onMouseout="resetit('div2')">Encarta</a> | <a href="http://britannica.com/" onMouseover="show_text(4,'div2')" onMouseout="resetit('div2')">Britannica</a> | <a href="http://www.dictionary.com" onMouseover="show_text(5,'div2')" onMouseout="resetit('div2')">Dictionary.com</a>

Follow the simple structure laid out inside the code to change the descriptions, plus set up corresponding links to utlize them.

Enjoy!

Wordpress Users: Step by Step instructions to add ANY Dynamic Drive script to an entire Wordpress theme or individual Post