Hallo Forum-Aktive,
kann bitte mal ein js-Kenner, der anders als ich kein Anfänger ist, über den folgenden Code schauen und mir sagen, ob der gewählte Weg einigermaßen so ist, "wie man es machen sollte".
Der Code erzeugt einen automatischen, zyklischen Bildlauf. Man kann ihn anhalten und fortsetzen, die Bildverweilzeit ändern und zurück- oder vorausliegende Bilder anspringen. Der Code tut, was er soll, aber mir kommt die Lösung extrem umständlich vor (ca. 70 Zeilen).
Für scharfe Kritik und Nennung von Sprachelementen, die ich vielleicht beseer hätte benutzen sollen, bin ich dankbar.
Auszuprobieren ist die Seite unter http://home.teleos-web.de/hhaase1/schwarzdorf/
Danke und mfG, Helmut
---------------------------------------------------------------------
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<!--
Anregung: http://de.selfhtml.org/javascript/objekte/images.htm#src
Voraussetzungen: Die Bilder stehen im Verzeichnis dieser Datei.
Die Bildnamen haben die Form ###Kette.jpg.
ist eine ganze Zahl von 001,002,..,nBild.
-->
<html><head><title>Bildlauf</title>
<script type="text/javascript">
// VVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVV EINGABE VVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVV
var Titel = "Bilder aus Schwarzdorf";
var Loesch = "Die Bilder erlöschen Ende Oktober.";
var nBild = 8;
var Kette = "_SD";
// AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA
function fAnima (){
i=parseFloat(document.Formular.iin.value);
if (i<0 || i>nBild) {i=0;}
if (i == nBild){i=0;} // Endlosschleife durch Rekursion
tt = parseFloat(document.Formular.thalte.value);
if (tt == 0){return;}
t=tt*1000;
document.images[0].src = b[i].src; // Ersetzt Bild
i = i + 1;
document.Formular.iin.value=i;
aktiv=window.setTimeout("fAnima()", t);
} // Ende function
function fStartStop ()
{
if (ss == 0) {window.clearTimeout(aktiv); ss=1; }
else {window.setTimeout("fAnima()"); ss=0;}
return ss;
}
function fblank(n){var z=" "; for(var i=1;i<=n;i++){z=z+" ";}return z;}
function fnline(n){var z="<br>"; for(var i=1;i<=n;i++){z=z+"<br>";}return z;}
</script></head>
<body style="position:absolute; top: 15px;">
<img src="001_Breslau.jpg" height="490" alt="jpg-Bild"> <!-- Anfangsbild -->
<script type="text/javascript">
var b = new Array(nBild);
var ss = 0; // Stopp/Start-Steuerung
for(var k =0; k <= nBild-1; k=k+1)
{
c=k+1;
b[k] = new Image();
if(k<9) b[k].src = "00"+c+Kette+".jpg"; // Auffüllen mit Nullen auf drei Stellen
else if(k<99) b[k].src = "0"+c[k]+Kette+".jpg"; // der "+"-Operator verkettet hier Strings
else b[k].src = c[k]+Kette+".jpg"; //
}
var i = 0;
</script>
<div style="position:fixed; left:700px; width: 300px; top: 15px;">
<script type="text/javascript">
document.write('<b>'+Titel+'</b><br><br>'+Loesch+fnline(20)+'Hinweis<br>'+
'Der automatische Bildlauf kann durch Eingaben in die beiden Zahlenfelder beeinflusst werden.')
</script>
</div>
<form name="Formular" action="">
<input type="text" name="thalte" value="3.5" size="1" />
<script type="text/javascript"> document.write('Sekunden'+fblank(42)); </script>
<input type="button" value="Halt / Weiter" onclick="fStartStop()">
<script type="text/javascript"> document.write(fblank(47)); </script>
<input type="text" name="iin" value="0.0" size="1" />
<script type="text/javascript">document.write(' von '+nBild); fAnima() </script>
</form>
</body></html>