Bilderwechsel nach Zeit

chaosgoettin

Mitglied
Hallo,

ich habe im PHP ein Array welches als Inhalt Bilder (kompletter Pfad) enthält.
Diese will ich nun darstellen und alle 3 Sek. wechseln lassen.
Aber wie mache ich das?

Vielen Dank
 
Willst du das ganze mit Javascript realisieren oder warum bist du im Javascript-Thread.

Ich sag dann einfach mal setIntervall().

Falls du weiter Fragen hast, gib bescheid.

MfG
 
vllt ist das hier ja was du suchst:

Script für den Header:

var x ist eine Zufallszahl wobei hier 5 Bilder zur Verfügung stehen. Die Bilder heißen dann image_1 bis 5.jpg

HTML:
<script language="JavaScript" type="text/javascript">
	function LoadImage(){
		var x = Math.floor(1+(5)*(Math.random()));
		var path = "http://www.domain.de/images/";
		document.getElementById("headerimage").src = path+"image_"+x+".jpg";
		
		setTimeout('LoadImage()', 5000);
	}	
</script>

In den Bodytag schreibst du folgendes:
HTML:
<body onLoad="LoadImage()">

Das Bild muss so aufgebaut sein:
HTML:
<img id="headerimage" src="http://www.domain.de/images/image_1.jpg">
 
ja ich wollte es schon über Javascript lösen, über php geht das ja glaub ich nicht. Wie mache ich es aber wenn meine Bildernamen in einem Array stehen?

Vielen Dank
 
naja das ist mir zu riesig. Oben der Script klingt ja so wie ich ihn haben will. Aber wie lese ich das array aus.

Ich werde an das JS ein Array
[0] = 'bilder/haus.jpg'
[1] = 'bilder/tier.jpg' ...

übergeben. Und diese müssen dargestellt werden.
Danke
 
Hi, so sollte es klappen
HTML:
<script language="JavaScript" type="text/javascript">
	function LoadImage(){		
                pics = new Array(bild1.jpg, bild2, ..., bild5);
                var x = Math.floor(1+(pics.length)*(Math.random()));
		var path = "http://www.domain.de/images/";
		document.getElementById("headerimage").src = path+pics[x];
		
		setTimeout('LoadImage()', 5000);
	}	
</script>
 
Vielen Dank,

habe es jetzt so gelöst:

<script language="JavaScript" type="text/javascript">
function lade_reisebilder()
{
Effect.Appear("headerimage", {duration:0.8, from:0.1, to:1.0});
document.getElementById("headerimage").src = bilder[zaehler];
zaehler++;
if(zaehler == bilder.length) { zaehler = 0; }
setTimeout('Effect.Fade("headerimage", {duration:0.8, from:1.0, to:0.1});',6200);
setTimeout('lade_reisebilder()', 7000);
}
</script>
 
vllt ist das hier ja was du suchst:

Script für den Header:

var x ist eine Zufallszahl wobei hier 5 Bilder zur Verfügung stehen. Die Bilder heißen dann image_1 bis 5.jpg

HTML:
<script language="JavaScript" type="text/javascript">
	function LoadImage(){
		var x = Math.floor(1+(5)*(Math.random()));
		var path = "http://www.domain.de/images/";
		document.getElementById("headerimage").src = path+"image_"+x+".jpg";
		
		setTimeout('LoadImage()', 5000);
	}	
</script>

In den Bodytag schreibst du folgendes:
HTML:
<body onLoad="LoadImage()">

Das Bild muss so aufgebaut sein:
HTML:
<img id="headerimage" src="http://www.domain.de/images/image_1.jpg">

Hallo zusammen!

Hab versucht das oben stehende Script auf meiner Hp anzuwenden. Allerdings tritt dann nicht der gewünschte Effekt ein, sondern die Bilder werden schlicht und ergreifend untereinander gestellt. Ich hab nicht allzu viel Ahnung von html- baue bzw habe alle im learning by doing verfahren erstellt. muss ich zusätzlich irgendwelche Werte o.ä. eingeben?
Den Link zur Seite findet ihr hier. Der Bildwechsel soll bei dem großen Startbild stattfinden. Vielleicht wäre ja jemand so nett sich den Quellcode anzusehen. Bin wirklich absolut ratlos...

Liebe Grüße, Philipp
 

Neue Beiträge

Zurück