Looping images

**darrellm** · 01-09-2007, 12:02 PM

1) Script Title: DHTML Slide Show Script

2) Script URL (on DD): http://www.dynamicdrive.com/dynamici...dhtmlslide.htm

3) Describe problem:
I would like my images to loop back or forward. If I'm at the begining of the slide show and click on the "back" button I would like for it to go all the way to the last image. If I get to the last image and keep clicking the "forward" button I would like for it to go to the first image.

I did a search and found an answer, but it doesn't work for me. Was it an old version, perhaps? Here's what that part of the code looks like:

function backward(){
if (which>0){
which--
applyeffect()
document.images.photoslider.src=photos[which]
playeffect()
keeptrack()
}
}

function forward(){
if (which<photos.length-1){
which++
applyeffect()
document.images.photoslider.src=photos[which]
playeffect()
keeptrack()
}
}

**jscheuer1** · 01-09-2007, 05:23 PM

Code:

function backward(){
if (which>0){
which=which-1;
else
which=photos.length-1;
applyeffect()
document.images.photoslider.src=photos[which]
playeffect()
keeptrack()
}
}

function forward(){
if (which<photos.length-1){
which=which+1;
else
which=0;
applyeffect()
document.images.photoslider.src=photos[which]
playeffect()
keeptrack()
}
}

Also, there is a much better, though more complex script for this which will soon be a part of the DD library. For now, the only information on it is here:

http://www.dynamicdrive.com/forums/s...ad.php?t=15903

**darrellm** · 01-10-2007, 02:18 AM

Thank you John. But it doesn't seem to work. Did I need to post the whole script on the head? I did like the link to the interactive slide show and if this doesn't work I'll give it a try. I do like the idea of the simplicity with just the "back" and "forward" and perhaps add a "1 of 18" images. Anyway, if you'd like to give it a try - Here it is:

<head>

<script type="text/javascript">

/***********************************************
* DHTML slideshow script- © Dynamic Drive DHTML code library (www.dynamicdrive.com)
* This notice must stay intact for legal use
* Visit http://www.dynamicdrive.com/ for full source code
***********************************************/

var photos=new Array()
var photoslink=new Array()
var which=0

//define images. You can have as many as you want:
photos[0]="images/portraits/001.jpg"
photos[1]="images/portraits/002.jpg"
photos[2]="images/portraits/003.jpg"
photos[3]="images/portraits/004.jpg"
photos[4]="images/portraits/005.jpg"
photos[5]="images/portraits/006.jpg"
photos[6]="images/portraits/007.jpg"
photos[7]="images/portraits/008.jpg"
photos[8]="images/portraits/009.jpg"
photos[9]="images/portraits/010.jpg"
photos[10]="images/portraits/011.jpg"
photos[11]="images/portraits/012.jpg"
photos[12]="images/portraits/013.jpg"
photos[13]="images/portraits/014.jpg"
photos[14]="images/portraits/015.jpg"
photos[15]="images/portraits/016.jpg"
photos[16]="images/portraits/017.jpg"
photos[17]="images/portraits/018.jpg"

//Specify whether images should be linked or not (1=linked)
var linkornot=0

//Set corresponding URLs for above images. Define ONLY if variable linkornot equals "1"
photoslink[0]=""
photoslink[1]=""
photoslink[2]=""

//do NOT edit pass this line

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

function applyeffect(){
if (document.all && photoslider.filters){
photoslider.filters.revealTrans.Transition=Math.floor(Math.random()*23)
photoslider.filters.revealTrans.stop()
photoslider.filters.revealTrans.apply()
}
}

function playeffect(){
if (document.all && photoslider.filters)
photoslider.filters.revealTrans.play()
}

function keeptrack(){
window.status="Image "+(which+1)+" of "+photos.length
}

function backward(){
if (which>0){
which--
applyeffect()
document.images.photoslider.src=photos[which]
playeffect()
keeptrack()
}
}

function forward(){
if (which<photos.length-1){
which++
applyeffect()
document.images.photoslider.src=photos[which]
playeffect()
keeptrack()
}
}

function transport(){
window.location=photoslink[which]
}

</script>

</head>

**jscheuer1** · 01-10-2007, 04:37 AM

Sorry, I should have tested it. I left in some braces that no longer belonged. Here is a working set of backward() and forward() functions for this script:

Code:

function backward(){
if (which>0)
which=which-1;
else
which=photos.length-1;
applyeffect()
document.images.photoslider.src=photos[which]
playeffect()
keeptrack()
}

function forward(){
if (which<photos.length-1)
which=which+1;
else
which=0;
applyeffect()
document.images.photoslider.src=photos[which]
playeffect()
keeptrack()
}

**darrellm** · 01-10-2007, 11:08 AM

Worked like a charm, John. Thanks for your help!

- Darrell

Thread: Looping images

Thread Tools

Search Thread

Looping images

Bookmarks

Bookmarks

Posting Permissions