Tim Maxey .NET Technology Blog & Resources

Thursday, May 14, 2009

Javascript clickable slideshow

I did NOT write this, I wanted a javascript slidshow to show off project screen shots and found this code and wanted to make sure I had it in my archives to search for later! Got this off: http://www.javascriptkit.com/howto/show3.shtml 

in head:

<script type="text/javascript">
<!--
//preload images
var image1=new Image()
image1.src="images/screenshot.jpg"
var image2=new Image()
image2.src="images/screenshot2.jpg"
var image3=new Image()
image3.src="images/screenshot3.jpg"
var image4=new Image()
image4.src="images/screenshot4.jpg"
//-->
</script>

In the body where you want the "images" to show up...

<a href="javascript:slidelink()">
<img src="images/screenshot.jpg" name="slide" border="0" width="492" height="354" /></a>
<script type="text/javascript">
<!--
var step=1
var whichimage=1
function slideit(){
if (!document.images)
return
document.images.slide.src=eval("image"+step+".src")
whichimage=step
if (step<4)
step++
else
step=1
setTimeout("slideit()",4000)
}
slideit()
function slidelink(){
if (whichimage==1)
window.location="page1.html"
else if (whichimage==2)
window.location="page2.html"
else if (whichimage==3)
window.location="page3.html"
else if (whichimage==4)
window.location="page4.html"
}
//-->
</script>