Hi,

I have a picture slider I completed from a tutorial a while ago that works fine, however I want to add another element to it and as im not too good at javascript Im having problems.

At the moment the slider scrolls through images when the 'next' or previous' buttons are clicked, and when the images are clicked on it goes to a defined link. What I want to add is a caption of text on the page aswell describing the picture when changed.

I will show the original code and then my feeble attempt to change it accordingly the way i think looks right from the way its layed out now. If anyone can clue me in to what im doing wrong or if i need to do it another way cos i dont think im even close really

Original Code: (ive left out some stuff i.e back forth buttons, colors etc)
Code:
var numberslide=new Array()
numberslide[0]=["images/photo1.jpg", "http://www.domain1.com"]

numberslide[1]=["images/photo2.jpg", "http://www.domain2.com"]
numberslide[2]=["images/photo3.jpg", "http://www.domain3.com"]
numberslide[3]=["images/photo4.jpg", "http://www.domain4.com"]
numberslide[4]=["images/photo5.jpg", "http://www.domain5.com"]

var mylinktarget=""
var mylinkcolor="#CCCCCC" 
var mylinkcolorSelected="#FF0000" 

var imgborderwidth=0 

var preloadit=new Array()
for (i=0;i<numberslide.length;i++){
preloadit[i]=new Image()
preloadit[i].src=numberslide[i][0]
}

var currentindex=""

function changeslides(which){
var imghtml=""
currentindex=(which=="initial")? 0 : parseInt(which)
var mode=(which=="initial")? "initial" : ""
var which=(mode=="initial")? numberslide[0] : numberslide[which]
if (which[1]!="")
imghtml='<a href="'+which[1]+'" target="'+mylinktarget+'">'
imghtml+='<img src="'+which[0]+'" border="'+imgborderwidth+'">'
if (which[1]!="")
imghtml+='</a>'

if (mode=="initial")
document.write('<div>'+imghtml+'</div>')
else{
document.getElementById("imagecontainer").innerHTML=imghtml
changecolors()
}
}
My attempt:
Code:
var numberslide=new Array()
numberslide[0]=["images/photo1.jpg", "http://www.domain1.com", "caption 1"]

numberslide[1]=["images/photo2.jpg", "http://www.domain2.com", "caption 2"]
numberslide[2]=["images/photo3.jpg", "http://www.domain3.com", "caption 3"]
numberslide[3]=["images/photo4.jpg", "http://www.domain4.com", "caption 4"]
numberslide[4]=["images/photo5.jpg", "http://www.domain5.com", "caption 5"]

var mylinktarget=""
var mylinkcolor="#CCCCCC" 
var mylinkcolorSelected="#FF0000" 

var imgborderwidth=0 

var preloadit=new Array()
for (i=0;i<numberslide.length;i++){
preloadit[i]=new Image()
preloadit[i].src=numberslide[i][0]
}

var currentindex=""

function changeslides(which){
var imghtml=""
currentindex=(which=="initial")? 0 : parseInt(which)
var mode=(which=="initial")? "initial" : ""
var which=(mode=="initial")? numberslide[0] : numberslide[which]
if (which[1]!="")
imghtml='<a href="'+which[1]+'" target="'+mylinktarget+'">'
imghtml+='<img src="'+which[0]+'" border="'+imgborderwidth+'">'
if (which[1]!="")
imghtml+='</a>'

if (mode=="initial")
document.write('<div>'+imghtml+'</div>')
else{
document.getElementById("imagecontainer").innerHTML=imghtml
changecolors()
}
}

function caption(which){
var caption=""
currentindex=(which=="initial")? 0 : parseInt(which)
var mode=(which=="initial")? "initial" : ""
var which=(mode=="initial")? numberslide[0] : numberslide[which]
if (which[3]!="")
caption='<p>'+which[1]+'</p>'
}
If you need the info i left out to make sense of it just let me know