Problem mit Slideshow

[doni]

Hallo allerseits

Es geht um folgende Seite: http://lumino.telltec.ch/dev/index.php?gallery=Natur
Das Javascript dazu: http://lumino.telltec.ch/dev/inc/slideshow.js

Ich habe mir selbst eine Bildergalerie gebaut, die auf PHP und Textdateien basiert. Nun möchte ich ein neues Feature einbauen, und zwar, dass die Bilder als Slideshow automatisch abgespielt werden können.

Dafür möchte ich Javascript verwenden und habe mir auch schon eine Funktion dafür geschrieben:

  
var timer;  
  
function slideshow(currentphoto,highestpicnumber,album){  
  
 var photonr = currentphoto + 1;  
 var slide = 'img-' + photonr + ".jpg";  
  
 document.displayedphoto.src = "galleries/" + album + "/" + slide;  
  
 photonr++;  
  
 timer = setInterval("slideshow(photonr,highestpicnumber,album)",3000);  
  
}  

Nun, ich übergebe drei Werte:

• Die Nummer des aktuell angewählten Photos auf dem die Slideshow gestartet werden soll
• Die Anzahl der Bilder in dem Album
• Der Albumname

Der zweite Wert (highestpicnumber) ist im Moment noch nicht wichtig, also wird auch gar noch nicht benutzt, nur dass es keine Verwirrung gibt.

Das Ding ist: das Erste (also das nächste Bild) wird korrekt dargestellt, doch dann, beim zweiten Ausführen der Funktion klappt es nicht mehr und das Bild wird nicht mehr dargestellt.

Ich kenne mich leider nicht wirklich (oder gar nicht) mit Javascript aus und habe aber trozdem mal versucht das Problem zu analysieren und mir dafür FireBug installiert. Der zeigt mir Javascript-Fehler an und zwar "currentphoto is not defined"...mhmm nun weis ich aber leider nicht, was genau ich falsch mache, denn ich zähle ja gleich eine Zeile vorher photonr++ und das funktioniert auch.

Ich hoffe jemand von euch kann mir weiterhelfen.

Gruss
doni

[wahsaga]

hi,

timer = setInterval("slideshow(photonr,highestpicnumber,album)",3000);

Abgesehen davon, dass du hier vermutlich nicht setInterval, sondern setTimeout verwenden willst - sonst wird nämlich bei jedem Aufruf der Funktion ein neues Intervall gestartet - musst du, wenn du aktuelle Variablenwerte übergeben willst, diese in den String einfügen:

timer = setTimeout("slideshow("+photonr+","+highestpicnumber+","+album+")",3000);

Und wenn album einen Text enthält, darum auch noch mal Anführungszeichen - bzw., hier lieber einfache Hochkommata, um escaping-Orgien zu vermeiden:

timer = setTimeout("slideshow("+photonr+","+highestpicnumber+",'"+album+"')",3000);

Aber da sich highestpicnumber und album vermutlich sowieso im Laufe der Schleife nicht ändern werden, wäre es einfacher, diese gleich als globale Variablen anzulegen.

gruß,
wahsaga

[doni]

gruß,
wahsaga

Jipee! Das klappt wunderbar! Das mit setTimeout wusste ich auch nicht! Vielen Dank!

Gruss
doni

[doni]

Hallo zusammen!

Mit Hilfe von wahsaga habe ich die Funktion erfolgreich so ergänzt, dass es funktioniert.
Nun habe ich noch eingebaut, dass es nur so lange ausgeführt wird, wie noch Bilder im Album vorhanden sind (highestpicnr) und auch das funktioniert wunderbar.
Zudem habe ich eingebaut, dass eine Meldung ausgegeben wird, wenn man das letzte Photo anschaut:

  
var timer;  
  
function slideshow(currentphoto,highestpicnumber,album){  
  
 // the next picture  
 var photonr = currentphoto + 1;  
 var slide = 'img-' + photonr + ".jpg";  
  
 // display the next picture  
 document.displayedphoto.src = "galleries/" + album + "/" + slide;  
  
 currentphoto++;  
  
 if(currentphoto < highestpicnumber){  
  timer = setTimeout("slideshow("+currentphoto+","+highestpicnumber+",'"+album+"')",3000);  
 } else{  
  window.alert("You've seen all photos in this album.");  
 }  
  
}  

Das ist super und funktioniert auch. Doch am schönsten wäre es, wenn die Meldung auch erst nach 3 Sekunden ausgegeben würde.
Ich habe das auch versucht mit setTimeout zu machen, hat aber leider nicht funktioniert.

Kann mir jemand helfen?

Danke vielmals!
Gruss
doni

[wahsaga]

hi,

if(currentphoto < highestpicnumber){
  timer = setTimeout("slideshow("+currentphoto+","+highestpicnumber+",'"+album+"')",3000);
} else{
  window.alert("You've seen all photos in this album.");

Das ist super und funktioniert auch. Doch am schönsten wäre es, wenn die Meldung auch erst nach 3 Sekunden ausgegeben würde.

Dreh den Spieß um.

if(currentphoto < highestpicnumber){
  // mit Slideshow weitermachen,
  // also Bild durch nächstes austauschen
  // ...
  // am Ende Funktion über setTimeout erneut aufrufen
}
else {
  // Meldung ausgeben
}

Wenn currentphoto kleiner highestpicnumber ist, wird das Bild gegen das nächste ausgetauscht, und mit setTimeout geht's in die "nächste Runde".

Irgendwann ist dann currentphoto nicht mehr kleiner als highestpicnumber - dann findet kein Bildwechsel mehr statt (soll ja auch nicht), und stattdessen geht's in den else-Zweig, wo die Meldung ausgegeben wird.

gruß,
wahsaga