Monday 3 October 2011

Java Script Image Slider


Java Script Image Slider

Step 1:
Insert the below into the <head> section of your page:

<script language="JavaScript1.1">
var slideimages=new Array()
var slidelinks=new Array()
function slideshowimages(){
for (i=0;i<slideshowimages.arguments.length;i++){
slideimages[i]=new Image()
slideimages[i].src=slideshowimages.arguments[i]
}}
function slideshowlinks(){
for (i=0;i<slideshowlinks.arguments.length;i++)
slidelinks[i]=slideshowlinks.arguments[i]
}
function gotoshow(){
if (!window.winslide||winslide.closed)
winslide=window.open(slidelinks[whichlink])
else
winslide.location=slidelinks[whichlink]
winslide.focus()
}
</script>


Step 2: Insert the below into the <body> section of your page where you wish the slideshow to appear:

<a href="javascript:gotoshow()"><img src="webihawk1.jpg" name="slide" border=0 width=300 height=375></a>
<script>
<!--


//configure the paths of the images, plus corresponding target links
slideshowimages("webihawk1.jpg","webihawk2.jpg","webihawk3.jpg","webihawk4.jpg","webihawk5.jpg")
slideshowlinks("http://webihawk.com/","http://webihawk.com/","http://webihawk.com/","http://webihawk.com/","http://webihawk.com/")


//configure the speed of the slideshow, in miliseconds
var slideshowspeed=2000


var whichlink=0
var whichimage=0
function slideit(){
if (!document.images)
return
document.images.slide.src=slideimages[whichimage].src
whichlink=whichimage
if (whichimage<slideimages.length-1)
whichimage++
else
whichimage=0
setTimeout("slideit()",slideshowspeed)
}
slideit()


//-->
</script>

0 comments:

Post a Comment

Twitter Delicious Facebook Digg Stumbleupon Favorites More