Ich habe von meinem Boss die Vorgabe bekommen, eine Art Diashow zu erstellen. Also habe ich das Beispiel aus SelfHTML mit den Dynamischen Filtern genommen und versucht zu modifizieren. Das Problem ist, dass die Bilder automatisch umspringen sollen und nicht mittels Mausklick. Gibt es unter JavaScript einen Befehl, der das bewirken kann?
Script sieht bisher wiefolgt aus:
Hallo Sibi,
ich misch mich jetzt mal in euren 2-Personen-Thread ein, weil ich denke, Du solltest in deinem Script auf jeden Fall noch etwas ändern,
unabhängig davon, ob es nun letztenendes funktioniert oder nicht.
Ich meine damit Deine Schleife wo Du jedesmal abfragst
if(Bild == 0)
...
if(Bild == 8)
Was machst Du denn, wenn es mal 100 Bilder werden sollen?
Dein Problem sollte eigentlich mit Hilfe eines Arrays gelöst werden,
da wird erstens der Code kürzer und zweitens leichter pflegbar.
Im folgenden mein Vorschlag.
Gruß Lutz.
<html>
<head>
<script language="JavaScript">
<!--
var i, AnzahlBilder=10;
Bild=new Array(AnzahlBilder);
for (i=0; i<9; i++)
{ Bild[i]= new Image();
Bild[i].src = eval(i+1)+".jpg";
}
Bild[9] = new Image(); Bild[9].src = "xx.jpg";
var BildNr=0;
function Bildwechsel(n)
{ if (BildNr==AnzahlBilder-1) return; //keine weiteren Bilder
if (n<BildNr) return; //Bildwechsel wurde bereits durch Klicken vollzogen
BildNr++;
document.all.DynBild.filters.revealTrans.Apply();
document.all.DynBild.src = Bild[BildNr].src;
document.all.DynBild.filters.revealTrans.Play();
setTimeout("Bildwechsel("+BildNr+")",5000); //nächster Bildwechsel in 5 Sekunden
}
//-->
</script>
<title></title>
<base target="_self">
</head>
<body link="#B22222" vlink="#B22222" alink="#FFFFFF" style="background-color: #000000" onLoad='setTimeout("Bildwechsel(0)",5000)'>
<div align="center">
<center>
<table border="0" width="100%" height="98%">
<tr>
<td width="100%" valign="middle" align="center" height="65%">
<p>
<img id="DynBild" src="1.jpg" style="cursor:hand; filter:revealTrans(Duration=4,Transition=3)" onClick="Bildwechsel(100)" width="437" height="354" alt="Unsere Fachräume">
</td>
</tr>
<tr>
<td width="100%" valign="middle" align="center" height="10%" style="color: #B22222">
<b><font face="Verdana,Arial" size="3">Willst Du unsere Räume erblicken, musst
du auf den Schriftzug klicken.</font></b>
</td>
</tr>
<tr>
<td width="100%" valign="middle" align="center" height="10%" style="color: #B22222">
<b><font face="Verdana,Arial" size="3"><a href="javascript:history.back()">zurück</a></font></b>
</td>
</tr>
</table>
</center>
</div>
</body>
</html>