I've just set up a page that utilizes a write() function to turn on and off text display - the point being that I need various text descriptions to appear next to fullsized images by clicking on a thumbnail image of the same picture above it.
Here's the code:
There's got to be a way to modify this javascript to turn off all descriptions that were previously turned on, but I'm not a programmer. Is there an easier way than listing all the div ID tags one by one in the image's onclick event?
Also, although this works great in IE, Netscape and other browsers seem to have problems with it.. Is there a way to get this feature cross-platform?
To see it in action, click here.
Any help much appreciated! Thanks!
- theAntic
Here's the code:
Code:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>thumbs</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<script language="JavaScript">
//Graphic Images
var imageA = new Array();
imageA[0] = "images/IMAGE-GG.jpg";
imageA[1] = "images/IMAGE-GN.jpg";
imageA[2] = "images/IMAGE-USAGrant.jpg";
imageA[3] = "images/IMAGE-eDream.jpg";
imageA[4] = "images/IMAGE-oyo-new.jpg";
imageA[5] = "images/IMAGE-bulletspeed-new.jpg";
imageA[6] = "images/IMAGE-synergy-new.jpg";
imageA[7] = "images/IMAGE-ewrmain.jpg";
imageA[8] = "images/Robot.jpg";
[b][COLOR=red yellow]with (document)
{
write("<STYLE TYPE='text/css'>");
if (navigator.appName == 'Microsoft Internet Explorer')
{
write(".HiliteOff {display:none}");
write(".HiliteOn {display:block}");
}
write("H1.blurb {font-family: verdana;color: #626262;font-size: 10pt;}");
write("</STYLE>");
}[/color][/b]
</script>
</head>
<body>
<table border="0" cellspacing="0" cellpadding="0">
<tr>
<td>
[COLOR=green yellow]<a href="#" onClick="newImageover(0)"><img src="images/THUMB-GG.jpg" border="0" onClick="TEXT1.className = 'HiliteOn',TEXT2.className = 'HiliteOff'"></a>[/color]</td>
<td><a href="#" onclick="newImageover(1)"><img src="images/THUMB-GN.jpg" border="0" onclick="TEXT2.className = 'HiliteOn',TEXT1.className = 'HiliteOff'"></a>
</td>
</tr>
</table>
<table cellpadding="0" cellspacing="0" border="0" width="630">
<td height="80" valign="top">
[COLOR=green yellow]<DIV CLASS="HiliteOff" ID="TEXT1"></B>
<H1 CLASS="blurb">GOVERNMENT GRANT GURUS</H3><P class="P1">
Blah, blah, blah.
</P>
</DIV>[/color]
<DIV CLASS="HiliteOff" ID="TEXT2"></B>
<H1 CLASS="blurb">GURUS NETWORK</H3><P class="P1">
Yada, yada, yada.
</P>
</DIV>
</td>
</table>
<table border="0" cellspacing="0" cellpadding="0">
<tr>
<td><img name="newImage" src="images/CENTER-graphics.jpg"></td>
</tr>
</table>
</body>
</html>There's got to be a way to modify this javascript to turn off all descriptions that were previously turned on, but I'm not a programmer. Is there an easier way than listing all the div ID tags one by one in the image's onclick event?
Also, although this works great in IE, Netscape and other browsers seem to have problems with it.. Is there a way to get this feature cross-platform?
To see it in action, click here.
Any help much appreciated! Thanks!
- theAntic
www.etoddt.com
