I have tried to put a javascript slide show in my site but i cam't seem to get it to work. Here is the code for my page i have checked that all my images and folder names are correct butit still won't work
Cheers for any help
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<title>KD Builders</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<link rel="stylesheet" type="text/css" href="KDBuilders1.css" media="screen" />
</style>
<script language="JavaScript">
<!--
var interval = 1500;
var random_display = 0;
var imageDir = "my_images/";
var imageNum = 0;
imageArray = new Array();
imageArray[imageNum++] = new imageItem(imageDir + "01.jpg");
imageArray[imageNum++] = new imageItem(imageDir + "02.jpg");
imageArray[imageNum++] = new imageItem(imageDir + "03.jpg");
var totalImages = imageArray.length;
function imageItem(image_location) {
this.image_item = new Image();
this.image_item.src = image_location;
}
function get_ImageItemLocation(imageObj) {
return(imageObj.image_item.src)
}
function randNum(x, y) {
var range = y - x + 1;
return Math.floor(Math.random() * range) + x;
}
function getNextImage() {
if (random_display) {
imageNum = randNum(0, totalImages-1);
}
else {
imageNum = (imageNum+1) % totalImages;
}
Now that we know which image to display, we just need to return the value:
var new_image = get_ImageItemLocation(imageArray[imageNum]);
return(new_image);
}
function getPrevImage() {
imageNum = (imageNum-1) % totalImages;
var new_image = get_ImageItemLocation(imageArray[imageNum]);
return(new_image);
}
function prevImage(place) {
var new_image = getPrevImage();
document[place].src = new_image;
}
function switchImage(place) {
var new_image = getNextImage();
document[place].src = new_image;
var recur_call = "switchImage('"+place+"')";
timerID = setTimeout(recur_call, interval);
// -->
</script>
</head>
<body>
<div id="container">
<div id="pageHeader"><IMG src="logo2.gif" height="80" width="250" />
</div>
<div id="button">
<ul>
<li><a href="Index.htm">Home</a></li>
<li><a href="GabionBaskets.htm">Gabion Baskets</a></li>
<li><a href="BuildingWork.htm">General Building</a></li>
<li><a href="ContactUs.htm">Contact Us</a></li>
</ul>
</div>
<DIV id=CenterBox><IMG src="image11.jpg" align=default>
<IMG src="image9.jpg" align=default>
<IMG src="image6.jpg" align=default>
<IMG src="image5.jpg" align=default>
</div>
<div id="LeftBox">
<h4>General Building</h4>
<div id="button1">
<ul>
<li><a href="Index.htm">Project 1</a></li>
<li><a href="AboutUs.htm">Project 2</a></li>
<li><a href="g.htm">Project 3</a></li>
</ul>
</div>
</div>
<div id="MiddleBox">
<h4>Project 1</h4>
<p class="p1"> KD Builders have over 13 years experience in the building and construction industry with both partners being
C.I.T.B trained to an advanced craft level and are experienced in all aspects of walling and general building
construction.</p>
<p class="p1">
The company has recently expanded into Gabion Basket installation and fitting service and acquired a new Director to the
company, Gordon Williamson who has over 10 years experience in this field of work.The company currently has a maximum of 10
staff at any one time. Although we are a small company we pride ourselves on our professionalism and craftsmanship with our
attention to detail.</p>
</div>
<div id="RightBox">
<img name="slideImg" src="27.jpg" >
<a href="#" onClick="switchImage('slideImg')">play slide show</a>
<a href="#" onClick="clearTimeout(timerID)"> pause</a>
<a href="#" onClick="prevImage('slideImg'); clearTimeout(timerID)"> previous</a>
<a href="#" onClick="switchImage('slideImg'); clearTimeout(timerID)">next </a>
</div>
<div id="Footer">
<img src="break.gif" width="300" height="2"/>
<p class="p1">
KD Builders <br>
Tel: 01484 6674534<br>
E-Mail: Info@KDBuilders.co.uk
</p>
</div>
</body>
</html>