Hi,
I’ve successfully coded a random image script for a single page. However I want to extended the use of random images to every page on my site.
The site has been built using a single HTML template. When the template is applied to every page (with a deep file structure), the images do not load beyond the depth of the index.html file which is at the top of the file structure – e.g.:
image
image1.jpg
image2.jpg
image3.jpg
image4.jpg
image5.jpg
page
page1.html
page2.html
templates
my_template.dwt
index.html
I am certain that the problem is that Javascript is not correctly referencing the images. This is the script that has been included in the template and then applied as is to every other page.
Any advice will be much appreciated.
Cheers,
Sean
<head>
<script language=”Javascript” type=”text/javascript”>
myPix1 = new Array(“/images/1.jpg”, “/images/2.jpg”)
myPix2 = new Array(“/images/3.jpg”, “/images/4.jpg”)
myPix3 = new Array(“/images/1.jpg”, “/images/2.jpg”, “/images/5.jpg”)
function choosePix() {
if (document.images) {
randomNum = Math.floor((Math.random() * myPix1.length))
document.myPicture1.src = myPix1[randomNum]
randomNum = Math.floor((Math.random() * myPix2.length))
document.myPicture2.src = myPix2[randomNum]
randomNum = Math.floor((Math.random() * myPix2.length))
document.myPicture3.src = myPix3[randomNum]
}
}
</script>
</head>
<body onload=”choosePix()”>
<table width=”450″ height=”113″ border=”0″ align=”center” cellpadding=”0″ cellspacing=”0″>
<tr>
<td><div align=”center”><img src=”/images/spacer.gif” width=”150″ height=”113″ name=”myPicture1″ alt=”” ></div></td>
<td><div align=”center”><img src=”/images/spacer.gif” width=”150″ height=”113″ name=”myPicture2″ alt=”” ></div></td>
<td><div align=”center”><img src=”/images/spacer.gif” width=”150″ height=”113″ name=”myPicture3″ alt=”” ></div></td>
</tr>
</table>
</body>