kostenloser Webspace werbefrei: lima-city

Javascript - Bild automatisch wechseln

lima-city → Forum → Die eigene Homepage → HTML, CSS & Javascript

1. Autor dieses Themas

   christian1603

   

   christian1603 hat kostenlosen Webspace.

   12:08, 1.4.2010

   Hallo LC,
   Ich habe eine JS Funktion um Bilder vor-zurück zu "spulen". Jetzt will ich noch eine Funktion (auto()) aufrufen. Mit deren Hilfe sollen die Bilder Automatich weitergespult werden und wenn keine mehr das da sind neuanfangen. Wie kann ich das machen?
   Hier mein JS:
   

   <script type="text/javascript">
   <!--
   var z = 0;
   
   var Bild = new Array();
   Bild[0] = "<img src=\"200001.jpg\" alt=\"1\" width=\"437px\" height=\"358px\" border=\"0\">";
   Bild[1] = "<img src=\"200002.jpg\" alt=\"2\" width=\"437px\" height=\"358px\" border=\"0\">";
   
   
   
   function Vor() 
   {
   if(z < Bild.length-1)
   z += 1;
   document.getElementById("bild").innerHTML = Bild[z];
   document.getElementById("zaehler").innerHTML = "Bild "+(z+1)+" von "+Bild.length;
   }
   
   function Zurueck()
   {
   if (z > 0)
   z-= 1;
   document.getElementById("bild").innerHTML = Bild[z];
   document.getElementById("zaehler").innerHTML = "Bild "+(z+1)+" von "+Bild.length;
   }
   
   function Hallo LC,
   Ich habe eine JS Funktion um Bilder vor-zurück zu "spulen".
   () 
   {
    //hier soll auto hin.
   }
   //-->
   </script>

   
   Danke Schonmal!
   LG
   Christian

2. Diskutiere mit und stelle Fragen: Jetzt kostenlos anmelden!

   lima-city: Gratis werbefreier Webspace für deine eigene Homepage

3. qap2

   

   qap2 hat kostenlosen Webspace.

   12:22, 1.4.2010

   Du hast es schon fast.
   Erst mal bei Vor() und Zurueck() immer aufs erste Bild / letzte Bild springen bei einem "Überlauf":
   

   function Vor() {
     if(z < Bild.length-1) {
       z += 1;
     } else {
       z = 0;
     }
     document.getElementById("bild").innerHTML = Bild[z];
     document.getElementById("zaehler").innerHTML = "Bild "+(z+1)+" von "+Bild.length;
   }
   
   function Zurueck() {
     if (z > 0) {
       z -= 1;
     } else {
       z = Bild.length-1;
     }
     document.getElementById("bild").innerHTML = Bild[z];
     document.getElementById("zaehler").innerHTML = "Bild "+(z+1)+" von "+Bild.length;
   }

   
   Übrigens wäre es besser, wenn du nicht "innerHTML" sondern "src" mit Daten fütterst.
   Aber das kannst du nachträglich ja noch ändern.
   Dann zu deiner Funktion "Auto":
   

   var warten = false; // Neue Boolean-Variable
   
   function Auto() {
     if(!warten) { // Nur Wiederholen wenn warten false ist
       Vor();
       setTimeout("Auto()",2000);
     }
   }
   
   function Stop() {
    warten = true; // Auto-Wiederholungen stoppen
   }

   
   So in etwa könnte man das realisieren.
   Ist nicht die beste Methode, aber es sollte funktionieren :)
   Viel Erfolg damit!
   
4. Autor dieses Themas

   christian1603

   

   christian1603 hat kostenlosen Webspace.

   12:50, 1.4.2010

   qap2 schrieb: Du hast es schon fast.
   Erst mal bei Vor() und Zurueck() immer aufs erste Bild / letzte Bild springen bei einem "Überlauf":
   

   function Vor() {
     if(z < Bild.length-1) {
       z += 1;
     } else {
       z = 0;
     }
     document.getElementById("bild").innerHTML = Bild[z];
     document.getElementById("zaehler").innerHTML = "Bild "+(z+1)+" von "+Bild.length;
   }
   
   function Zurueck() {
     if (z > 0) {
       z -= 1;
     } else {
       z = Bild.length-1;
     }
     document.getElementById("bild").innerHTML = Bild[z];
     document.getElementById("zaehler").innerHTML = "Bild "+(z+1)+" von "+Bild.length;
   }

   
   Übrigens wäre es besser, wenn du nicht "innerHTML" sondern "src" mit Daten fütterst.
   Aber das kannst du nachträglich ja noch ändern.
   Dann zu deiner Funktion "Auto":
   

   var warten = false; // Neue Boolean-Variable
   
   function Auto() {
     if(!warten) { // Nur Wiederholen wenn warten false ist
       Vor();
       setTimeout("Auto()",2000);
     }
   }
   
   function Stop() {
    warten = true; // Auto-Wiederholungen stoppen
   }

   
   So in etwa könnte man das realisieren.
   Ist nicht die beste Methode, aber es sollte funktionieren :)
   Viel Erfolg damit!
   

   
   DANKE Funktioniert soweit!
   Ich hab noch 1 Problem.
   Und wenn ich auf play klicke startet er. Wenn ich nochmal auf play drücke spielt er aber weiter? kann ich beides auf einen Button machen? also beim Erneut klicken soll die Funktion Stop() aufgerufen werden.
   Wäre Cool wenn du mich nochmal helfen könntest :-)
   
   Beitrag zuletzt geändert: 1.4.2010 13:08:28 von christian1603

5. Diskutiere mit und stelle Fragen: Jetzt kostenlos anmelden!

   lima-city: Gratis werbefreier Webspace für deine eigene Homepage

Dir gefällt dieses Thema?