Weatherman: Autorefresh eines Loops bei Einlauf von neueren Bildern

Hallo,

vorab, ich bin totaler HTML-Neuling, habe aber folgende Anforderung:

Auf einer Seite soll sich ein Loop aus 25 Einzelbildern automatisch aktualisieren, sobald neue Bilder verfügbar sind. Der Loop soll dabei nicht erst wieder über einen Startbutton gestartet werden, sondern selbständig weiterlaufen. Im Moment habe ich erreicht, dass sich die Seite nach einer festgelegten Zeit aktualisiert. Den Loop muss ich dann aber trotzdem per Klick erst wieder starten. Ist so etwas machbar? Das Script ist in Teilen angehängt.

Vielen Dank schon mal

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">  
<html>  
  <head>  
    <meta name="generator" content=  
    "HTML Tidy for Windows (vers 14 February 2006), see www.w3.org">  
    <meta http-equiv="content-type" content="text/html; charset=ISO-8859-1">  
    <script language="JavaScript" type="text/javascript">setTimeout("location.reload();",10000)  
  
<!--  
  
 // dieser Array dient nur zur Auflistung der Bilder  
 var BildListe = new Array();  
BildListe [0] =.......  
 // vorzuladene Bilder werden nun in den neuen Array 'Bilder' geschrieben  
 var Bilder = new Array()  
  
function Vorladen01()  
{  
  for (i = 0; i < BildListe.length; i++) {  
    Bilder[i] = new Image();  
    Bilder[i].src = BildListe[i];  
  }  
}  
  
  
Vorladen01();  
  
//-->  
</script>  
    <title>  
      Niederschlag_Switcher  
    </title>  
  </head>  
<body OnLoad="BildListe">  
  
 <script language="JavaScript" type="text/javascript">  
function changebild(link,bild) {  
    linklink='http://www.dwd.de' + link;  document.getElementById('bild').src = bild  }  
    var pfad = new Array;  
    pfad[0] = .........  
    var numbilder = 25;  
  
    var rvbild = 0;  
    var lauf;  
    var speed = 500;  
    var switched = 0;  
    bilder = new Array();  
    function switching()  
    {  
    if(!switched) return;  
    if( rvbild < numbilder)  
    {  
        document.getElementById("bild").src = pfad[rvbild];  
    }  
    rvbild++;  
    if(rvbild == numbilder+1) rvbild = 0;  
    document.getElementById("switch").innerHTML = "Stop";  
    document.getElementById("switch").href = "javascript:stopLauf();";  
    document.getElementById("langsamer").innerHTML = "langsamer";  
    document.getElementById("schneller").innerHTML = "schneller";  
    if(rvbild < numbilder)  
    {  
        lauf = setTimeout("switching()", speed);  
    }  
    else  
    {  
        lauf = setTimeout("switching()", 1500);  
    }  
    }  
  
    function startLauf()  
    {  
          if(switched == 0)  
        {  
                switched = 1;  
                switching();  
                //lauf = setTimeout("switching()", speed);  
        }  
    }  
    function stopLauf()  
    {  
        //if(switched == 1)  
        {  
                switched = 0;  
                document.getElementById("switch").innerHTML = "Loop";  
                document.getElementById("switch").href = "javascript:startLauf();";  
                document.getElementById("langsamer").innerHTML = "langsamer";  
                document.getElementById("schneller").innerHTML = "schneller";  
                clearTimeout(lauf);  
        }  
    }  
  
    function schneller()  
    {  
        if(switched == 1)  
        {  
                speed = speed - 100;  
                if(speed < 100) speed = 100;  
        }  
        else  
        {  
                rvbild = rvbild + 1;  
                if(rvbild >= numbilder) rvbild = numbilder-1;  
                document.getElementById("bild").src = pfad[rvbild];  
        }  
    }  
    function langsamer()  
    {  
        if(switched == 1)  
        {  
                speed = speed + 100;  
                if(speed > 2000) speed = 2000;  
  
          }  
        else  
        {  
                rvbild = rvbild - 1;  
                if(rvbild < 0) rvbild = 0;  
                document.getElementById("bild").src = pfad[rvbild];  
        }  
  
    }  
  
    </script>  
    <table border="2" width="100%">  
      <tbody>  
         <tr bgcolor="#AEB9CB">  
          <td>  
            <a onmouseover=  
            "javascript:changebild('pfad=0',.........</p>  
          </td>  
        </tr>  
      </tbody>  
    </table>  
  </body>  
</html>
  1. Hallo,

    es funktioniert, wenn Du in das <body> tag Deiner HTML Seite den richtigen Funktionsaufruf des JavaScripts einfügst:

    statt:
    <body OnLoad="BildListe">

    <body OnLoad="javascript:BildListe();">

    Eine javascript Funktion muss immer mit einem Klammerpaar aufgerufen werden.

    Außerdem scheint 'BildListe' ein Array und keine Funktion zu sein.
    Hier muss die Funktion aufgerufen werden, die Deinen Bildershow startet.

    Viele Grüße,
    Dave

    1. statt:
      <body OnLoad="BildListe">

      <body OnLoad="javascript:BildListe();">

      Wozu benötigst du hier ein Label?

      Struppi.

      1. Inzwischen bin ich soweit, dass nach meiner festgelegten Refreshtime der Loop automatisch wieder startet. Es soll aber so sein, dass die Seite erst nach dem Einlauf von neueren Dateien automatisch refreshed wird, also nicht nach einem festen Zyklus. Ist das machbar?

    2. BildListe ist tatsächlich ein Array. Die function startLauf kommt ja weiter unten im Script (also das was passiert, wenn man den Loopknopf drückt). Wie schreib ich das dann?

      Aber durch den Aufruf wird der Loop ja nicht automatisch aktualisiert, sobald neue Dateien verfügbar sind?!

      Besten Dank