OK he it goes...... Some of my clients are local contractors /
construction companies. They like to have images to show off current
and past projects. Most of the time it involves an image and some
text to explain what picture is. The last update I did was over 70
images. I decided to have a blank page that could be updated with a
link, that would put the source for the image and text for the image
on that page, to save me time creating 70 pages. I was unable to find
a way and had to create 70 pages. Not fun.
Today I finally put enough information together from different sources
to create the following code in two pages. I don't like they way I
trick the system into using the correct code. I also don't have a way
to test other browsers other than IE and Netscape. This code works on
my sytem in both IE 6 and Netscape 7.02.
Netscape uses this code:
window.frames['external'].setup(links[aNum]);}
IE uses this code:
document.extern al.setup(links[aNum]);
index page:
<table border="1" width="600">
<tr valign="top">
<td width="200">
<script language="javas cript" type="text/javascript">
var links=new Array();
links[4]=new Array("pic1.jpg ","pic1 link text","text for pic1");
links[3]=new Array("pic2.jpg ","pic2 link text","text for pic2");
links[2]=new Array("pic3.jpg ","pic3 link text","text for pic3");
links[1]=new Array("pic4.jpg ","pic4 link text","text for pic4");
function showImg(aNum)
{
if (navigator.appN ame.substring(0 , 7) != "Microso"){
window.frames['external'].setup(links[aNum]);}
else {
document.extern al.setup(links[aNum]);
}
};
for (var i=links.length-1;i>=0;i--)
{
document.write( '<a href="#" onclick=showImg ("'+i+'")>' + links[i][1] +
'</a><br>');
}
</script>
</td>
<td align="center" width="500">
<iframe name="external" id="external" style="width:10 0%;height:500px "
src="picture.ht ml"></iframe>
</td></tr></table>
here is the code in the pictrure.html file
<script language="javas cript">
function setup(aLink)
{
document.getEle mentById("pic") .src=aLink[0];
document.getEle mentById("title ").innerHTML=aL ink[2];
}
</script>
</head>
<body>
<center>
<img src="pic1.jpg" id="pic">
<p id="title">Tex t for Pic1</p>
</center>
