Produce a slideshow for the pictures on your site with this simple script
<! DOCTYPE html PUBLIC "- / / W3C / / DTD XHTML 1.0 Transitional / / EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title> Practical 1 - CST </ title>
<script type="text/javascript">
<! -
/ / Preload images
var image1 = new Image ()
image1.src = "images/img1.jpg"
var image2 = new Image ()
image2.src = "images/img2.jpg"
var image3 = new Image ()
image3.src = "images/img3.jpg"
var image4 = new Image ()
image4.src = "images/img4.jpg"
//-->
</ Script>
<style type="text/css">
<! -
body, td, th {
font-family: Arial, Helvetica, sans-serif;
font-size: 12px;
color: # 003399;
}
body {
background-color: # 999999;
margin-left: 50px;
margin-top: 50px;
margin-right: 50px;
margin-bottom: 50px;
}
->
</ Style> </ head>
<body>
<h1> Practical 1 - CST </ h1>
<h2> <strong> Aim: </ strong> Write JavaScript code to Create Image Slide show. </ h2>
</ P>
<p> <a href="javascript:slidelink()"> src="images/img1.jpg" name="slide" <img border="0" width="500" height="300" /> </ a> </ p>
<p>
<script type="text/javascript">
<! -
var step = 1
var = 1 whichimage
SlideIT function () {
if (document.images)
return
document.images.slide.src = eval ("image" + step +. "src")
whichimage = step
if (step <4)
step + +
else
step = 1
setTimeout ("SlideIT ()", 1800)
}
SlideIT ()
slidelink function () {
if (whichimage == 1)
window.location = "images/img1.jpg"
else if (whichimage == 2)
window.location = "images/img2.jpg"
else if (whichimage == 3)
window.location = "images/img3.jpg"
else if (whichimage == 4)
window.location = "images/img1.jpg"
}
//-->
</ Script>
</ P>
Click on the image to see it.
</ P>
</ Body>
</ Html>