Altering Image Slide Show Settings

Trying to set a loop limit

[mida68]

I've been trying to add a fading slide show to my home page and have found a few scripts on the web that seem to be short and quick loading. The only thing I can't seem to find is one where I can set the slide show to stop. I know you can easily do this with an animated gif (set the number of loops).

Here is the code:

// Set slideShowSpeed (milliseconds)
var slideShowSpeed =5000

// Duration of crossfade (seconds)
var crossFadeDuration = 3

// Specify the image files
var Pic = new Array() // don't touch this
// to add more images, just continue
// the pattern, adding to the array below

Pic[0] = 'images/animation/image1.jpg'
Pic[1] = 'images/animation/image2.jpg'
Pic[2] = 'images/animation/image3.jpg'
Pic[3] = 'images/animation/image4.jpg'
Pic[4] = 'images/animation/image5.jpg'

// =======================================
// do not edit anything below this line
// =======================================

var t
var j = 0
var p = Pic.length

var preLoad = new Array()
for (i = 0; i < p; i++){
preLoad[i] = new Image()
preLoad[i].src = Pic[i]
}

function runSlideShow(){
if (document.all){
document.images.SlideShow.style.filter="blendTrans(duration=2)"
document.images.SlideShow.style.filter="blendTrans(duration=crossFadeDuration)"
document.images.SlideShow.filters.blendTrans.Apply()
}
document.images.SlideShow.src = preLoad[j].src
if (document.all){
document.images.SlideShow.filters.blendTrans.Play()
}
j = j + 1
if (j > (p-1)) j=0
t = setTimeout('runSlideShow()', slideShowSpeed)
}

Can anyone tell me how to set the number of times the script loops the image set?

Thanks!

[Purple Martin]

You need two new variables, one to count how many times the slideshow has been shown and one to set the maximum. Declare them outside any functions so they've got global scope: declare them just below where p is declared.

var count = 0 // set count to 0. don't touch.
var max = 20 // set your maximum here

Then you need to increment count each time the slideshow completes, and exit the runSlideShow function if count has reached max.

Put something like this immediately before the function's last line:

if (j == 0) { // are we at the end of a full set of slides?
count = count + 1 // this line increments the count
if (count == max) { // have we reached the maximum yet?
return false // this line just quits the function, so the slideshow stops.
}
}

[mida68]

Thanks Purple, I don't know much about JS but what you wrote seems to make sense, however, the slides are still playing without stopping. Here is how I incorporated your code:

<script>

// =======================================
// set the following variables
// =======================================

// Set slideShowSpeed (milliseconds)
var slideShowSpeed =5000

// Duration of crossfade (seconds)
var crossFadeDuration = 3

// Specify the image files
var Pic = new Array() // don't touch this
// to add more images, just continue
// the pattern, adding to the array below

Pic[0] = 'images/animation/image1.jpg'
Pic[1] = 'images/animation/image2.jpg'
Pic[2] = 'images/animation/image3.jpg'
Pic[3] = 'images/animation/image4.jpg'
Pic[4] = 'images/animation/image5.jpg'

// =======================================
// do not edit anything below this line
// =======================================

var t
var j = 0
var p = Pic.length

var count = 0 // set count to 0. don't touch.
var max = 3 // set your maximum here

var preLoad = new Array()
for (i = 0; i < p; i++){
preLoad[i] = new Image()
preLoad[i].src = Pic[i]
}

function runSlideShow(){
if (document.all){
document.images.SlideShow.style.filter="blendTrans(duration=2)"
document.images.SlideShow.style.filter="blendTrans(duration=crossFadeDuration)"
document.images.SlideShow.filters.blendTrans.Apply()
}
document.images.SlideShow.src = preLoad[j].src
if (document.all){
document.images.SlideShow.filters.blendTrans.Play()
}
j = j + 1
if (j > (p-1)) j=0
t = setTimeout('runSlideShow()', slideShowSpeed)
if (j == 0) { // are we at the end of a full set of slides?
count = count + 1 // this line increments the count
if (count == max) { // have we reached the maximum yet?
return false // this line just quits the function, so the slideshow stops.
}
}

}

Did I paste your segements in correctly?

THANKS! :-D

[Purple Martin]

Did I paste your segements in correctly?

Not quite: you've declared the variables correctly, but the other bit needs to go ABOVE

t = setTimeout('runSlideShow()', slideShowSpeed) 

to quit the function runSlideShow() BEFORE the runSlideShow() function gets called all over again.

HTH

[mida68]

THANK YOU! It works nicely now ;-)