View Full Version : Textual tooltip II (fade into view) with images?

10-09-2006, 06:15 PM
1) Script Title: Textual tooltip II (fade into view)

2) Script URL (on DD): http://www.dynamicdrive.com/dynamicindex5/linkinfo2.htm

3) Describe problem: Is it possible for this script to work with an image appearing instead of text when you roll over a hyperlink?


10-10-2006, 09:54 AM
Hmm i think you are looking for something that performs a image rollover which is based on the mouseover/moustout event of some hyperlinks.

I haven't modified the script you mentioned but i think you can use the following idea to do it for you.

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
<title>Untitled Document</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">

<table cellpadding="0" cellspacing="0" border="0" width="760">
<tr><td width="300" valign="top">
<a href="http://www.dynamicdrive.com/" onMouseOver="document.getElementById('first').style.visibility = 'visible';" onMouseOut="document.getElementById('first').style.visibility = 'hidden';">Dynamic Drive</a>
<a href="http://www.javascriptkit.com/" onMouseOver="document.getElementById('second').style.visibility = 'visible';" onMouseOut="document.getElementById('second').style.visibility = 'hidden';">Javascript Kit</a>
<a href="http://www.php.net/" onMouseOver="document.getElementById('third').style.visibility = 'visible';" onMouseOut="document.getElementById('third').style.visibility = 'hidden';">PHP Information</a>
<td width="460" valign="top">
<img id="first" src="1.png" style="visibility:hidden; position:absolute; padding-top:0px;" >
<img id="second" src="2.png" style="visibility:hidden; position:absolute;padding-top:0px;">
<img id="third" src="3.png" style="visibility:hidden; position:absolute;padding-top:0px;">

10-10-2006, 12:54 PM
Much simpler! works a treat - thanks!