Click to See Complete Forum and Search --> : Basic Slideshow angst...


Kevintempo
11-20-2003, 11:03 PM
Greetings! I have been working on my version of the simple Slideshow script, and I got everything to work except for the captions. I am very new to Javascript, but I know C++ so I at least understand the code. For some reason, the 'current' variable is always zero, which always displays the caption "1st Image". I would appreciate any help - Thanks!


<html>
<body bgcolor="#242424" text="#CCCCCC">
<font face="Verdana" size="2">

<form>
<center>
<script language="JavaScript">
<!------BEGIN---------
var current = 0;

// Sets up variable type for holding images
function imageArray()
{
this.length = imageArray.arguments.length;
for (var i = 0; i < this.length; i++)
{
this[i] = imageArray.arguments[i];
}
}

// Sets up variable type for hold corresponding strings
function StringArray(n)
{
this.length = n;
for (var x = 1; x <= n; x++)
{
this[x] = ' ';
}
}

// create all images
var imgz = new imageArray("image1.jpg", "image2.jpg", "image3.jpg", "image4.jpg");

// create all strings
var message = new StringArray(imgz.length);

// fill in strings
message[0] = "1st Image";
message[1] = "2nd Image";
message[2] = "3rd Image";
message[3] = "4th Image";

document.write('<img name="myImages" border="1" src="'+imgz[0]+'">');
document.write('<br>');
document.write(message[current]);

function getPosition(val)
{
var goodnum = current+val;
if (goodnum < 0)
goodnum = imgz.length-1;

if (goodnum > imgz.length-1)
goodnum = 0;

document.myImages.src = imgz[goodnum];

current = goodnum;
}
//-------END--------->
</script>

<p>
<input type="button" value="<< Back <<" onclick="getPosition(-1)">
<input type="button" value=">> Next >>" onclick="getPosition(1)">
</center>
</form>

</font>
</body>
</html>

Gollum
11-21-2003, 05:42 AM
Your code is nearly right, your 'current' variable is being updated, after all the images are changing properly. The reason your caption isn't changing is that you aren't doing anything to change it.
in your function getPosition(), you cycle the current variable and set the img.src, but you also need to change the text...
I'd suggest wrapping a <span id=myCaptions> tag around it...

document.write("<span id='myCaptions'>" + message[current] + "</span>");

...

document.myImages.src = imgz[goodnum];
document.getElementById('myCaptions').innerHTML = message[goodnum];

Kevintempo
11-21-2003, 04:54 PM
Thank you very much :)