PDA

View Full Version : Blending Image slideshow script help



Dawn
08-03-2006, 01:16 PM
Blending Image slideshow script help

http://www.dynamicdrive.com/dynamicindex14/image4.htm

Hi dumb question but I can this script be changed to add more than three images I have tried to add some more with no success :(

I normally can follow scripts quite well but this one does not seem to let me
:(

thanks
Dawn

boogyman
08-03-2006, 08:18 PM
I find that tutorial very confusing as well. Here is a very easily customizable image slideshow.

Put this in your <head> script


<script type="text/javascript">
// <![CDATA[
var interval = 1; // Change this interval depending on how long you want in between images
var current = 0;
var pick = 0;
if (document.images) { // Preload Images to use for the slideshow
var slides = new Array(); // Just add a new slide and the assosiated link to it
slides[0] = new Image() // To customize your images... Doesnt matter how many
slides[0].src = "images1.gif"; // just as long as it has a minimum of 2
slides[1] = new Image()
slides[1].src = "images2.gif";
slides[2] = new Image()
slides[2].src = "images3.gif";
slides[3] = new Image()
slides[3].src = "images4.gif";
slides[4] = new Image()
slides[4].src = "images5.gif";
slides[5] = new Image()
slides[5].src = "images6.gif";
slides[6] = new Image()
slides[6].src = "images7.gif";
slides[7] = new Image()
slides[7].src = "images8.gif";
}

function next() { // Tells the computer what image is going to be next in the slideshow
if(document.images && document.slideshow.complete) {
if(current == slides.length) {
current = 0;
}
document.slideshow.src = slides[current].src;
current++;
}
}

function show() { // Starts a default slideshow with interval of 1 second
slideShow = setInterval("next()", interval*1000);
}
// ]]>
</script>



Put this in your <body> tag where you want your slideshow to appear

<form action="#">
<img src="images/images1.gif" id="slideshow" height="200" width="200" alt="slideshow" />
<br />
<input type="button" value="Start Show" onclick="show()" />
<input type="button" value="Stop Show" onclick="clearInterval(slideShow);'" />
</form>

where images/images1.gif is the link for the image you want displayed first and dont forget to change the height and width of your image to fit the correct specifications. the start show and stop show buttons are added in as something i thought you might want to use.
Hope this helps.

Dawn
08-04-2006, 06:19 AM
Thank you I will try this one :)

Dawn
08-04-2006, 06:42 AM
Hi just tried it and changed my images in the head part ,then edited the body part as you stated and nope no luck pressed the start button and nothing happens :confused: got an error on page so not sure .
Dawn